Full parsing of JS arrays (methods of creating arrays, sparse arrays, detecting arrays, addition and deletion of array elements, common array methods)

A Brief Introduction to JS Arrays

The function of an array object is to store a series of values with a separate variable name.
In JS, arrays are also objects
Arrays in JS are weakly typed, and an array can contain different types of elements, even other objects or arrays.
Simple Array Object Reference Manual: http://www.w3school.com.cn/js/js_obj_array.asp
Complete Array Object Reference Manual: http://www.w3school.com.cn/jsref/jsref_obj_array.asp

Method of creating arrays

Literal

var arr = [
    'Jonathon David White',
    [1, 2, 3],
    {
        name : 'bxm',
        age : 20
    },
    null
];

console.log(arr[0]);
console.log(arr[1][1]);
console.log(arr[2].age);
console.log(arr[3]);

new Array (note: new can be omitted)

var arr1 = new Array(); // If no parameter is used when calling the constructor Array(), the returned array is empty and the length field is 0.

var arr2 = new Array(100); // When a constructor is called, only one numeric parameter is passed to it, which returns an array with a specified number of undefined elements.

var arr3 = new Array(true, null, 2, 'hi'); // When other parameters call Array(), the constructor initializes the array with the values specified by the parameters.

Multidimensional Array

// Two-dimensional array,99Multiplication table

var arr = []
for (var i = 1; i <= 9; i++) {
    arr[i] = [];
    for (var j = 1; j <= i; j++) {
        arr[i][j] = j + '×' + i + '=' + i*j;
        document.write(arr[i][j] + ' ');
    }
    document.write('<br>');
}

Sparse array

Sparse arrays denote that indexes are discrete arrays.

var arr = new Array();

arr[3] = 100;

console.log(3 in arr); // true
console.log(2 in arr); // false

console.log(arr.length); // 4
console.log(arr[2]); // undefined
console.log(arr[3]); // 100
console.log(arr[4]); // undefined

Addition and deletion of array elements

Entry (Entry) push()

var arr = new Array(true, null, 2, 'hi');
arr3.push("elem"); // Add an element at the end of the array

pop()

var arr = new Array(true, null, 2, 'hi');
arr.pop()

Queue shift()

var arr = new Array(true, null, 2, 'hi');
arr.shift(); // Remove elements from the array header

unshift()

var arr = new Array(true, null, 2, 'hi');
arr.unshift('haha'); // Add an element to the head of the array

delete

var arr = new Array(true, null, 100, 'hi');
delete arr[2]; // Length unchanged, deletion position changed to undefined

// Be careful:
// and arr[2] = undefined; Unequal
// the former console.log(100 in arr); Returnfalse
// the latter console.log(100 in arr); Returntrue

arr[arr.length]

var arr = new Array(true, null, 2, 'hi');
arr[arr.length] = 'hello'; // Ar [arr. length] always points to the next element in the last element of the array, so you can assign values in this way. Equivalent to arr.push('hello')

arr.length -=1;

var arr = new Array(true, null, 2, 'hi');

arr.length -= 1; // Delete the last element

Detection array

instanceof

var arr = new Array(true, null, 2, 'hi');
console.log(arr instanceof Array);

Better way: Array.isArray()

var arr = new Array(true, null, 2, 'hi');
console.log(Array.isArray(arr));

Commonly used array methods

join(): Converts an array to a string, separated by a specified delimiter

var arr = [5, 2 ,3];
console.log(arr.join());
console.log(arr.join('-'));

toString(): Converts an array to a string, separates it by commas, and returns the result.

The return value is the same as the string returned by the join() method without parameters.

var arr = [1, 2 ,3, 4, 5];
console.log(arr.toString()); // 1,2,3,4,5

concat(): Combination of numbers

Note: This method does not change the original array

var arr = [5, 2 ,3];

console.log(arr.concat([100, 6]));
console.log(arr.concat([100, 6, [1, 2]]));

slice(start, end): Returns fragments of an array

Note: This party will not change the original array

var arr = [5, 2 ,3, 15, 666];

console.log(arr.slice(1)); // [2, 3, 15, 666], if the end is not specified, the slice() method selects all elements from start to the end of the array.
console.log(arr.slice(1,3)); // [2 ,3]
console.log(arr.slice(2,-1)); // [3, 15], -1 represents the last element, and-2 represents the penultimate element.

splice(index, howMany): Delete fragments of arrays

Note: This method changes the original array

var arr1 = [5, 2 ,3, 15, 666];
console.log(arr1.splice(2)); // [3, 15, 666]
console.log(arr1); // [5, 2]

var arr2 = [5, 2 ,3, 15, 666];
console.log(arr2.splice(3, 1)); // [15]
console.log(arr2); // [5, 2 ,3, 666]

var arr3 = [5, 2 ,3, 15, 666];
console.log(arr3.splice(3, 1, 'white', 'Xiao Ming')); // [15]
console.log(arr3); // [5, 2, 3, Bai, Xiaoming, 666]

Reordering method

Ascending order: sort()

var arr = new Array(4, 2, 3, 15);
console.log(arr.sort()); // ASCII ascending order
// [15, 2, 3, 4]

Descending order: reverse()

var arr = new Array(4, 2, 3, 5);
console.log(arr.reverse()); // ASCII descending order
// [4, 3, 2, 15]

Note: After using sort() and reverse() methods, the original array is modified

The sort() and reverse() methods call each array element's toString() method, which is converted into a string and compared ().

var arr = new Array(4, 2, 3, 15);

function sortCompare(value1, value2) {
    return value1 -value2;

    // if (value1 < value2) {
    //  return -1;
    // } else if (value1 > value2) {
    //  return 1;
    // } else {
    //  return 0;
    // }
}

function reverseCompare(value1, value2) {
    return value2 -value1;

    // if (value1 < value2) {
    //  return 1;
    // } else if (value1 > value2) {
    //  return -1;
    // } else {
    //  return 0;
    // }
}

console.log(arr.sort(sortCompare)); // Ascending order
console.log(arr.reverse(reverseCompare)); // Descending order

Array Iteration Method

Note: None of the following methods will change the original array

forEach: Let each element in an array do one thing

var arr = [5, 2 ,3, 15, 666];
arr.forEach(function(element, index){
    console.log(element + 10); // 15, 12, 13, 25, 676
});
console.log(arr); // [5, 2, 3, 15, 666]

map: Let an array produce a new array by some operation

var arr = [5, 2 ,3, 15, 666];
var arrMap = arr.map(function(index, elem) {
    return index + 10;
});

console.log(arrMap); // [15, 12, 13, 25, 676]
console.log(arr); // [5, 2, 3, 15, 666]

filter: Screen out the qualified elements in the array to form a new array

var arr = [5, 2 ,3, 15, 666];
var newArr = arr.filter(function(item, index) {
    return item > 3;
});

console.log(newArr); // [5, 15, 666]
console.log(arr); // [5, 2, 3, 15, 666]

reduce: Let the front and back of an array do some sort of operation and accumulate the final value

var arr = [1, 2 ,3, 4, 5];
var newArr = arr.reduce(function (prev, next) {
    return prev + next;
});

console.log(newArr); // 15    (1+2+3+4+5)
console.log(arr); // [1, 2 ,3, 4, 5]

every: Check whether each item in the array meets the criteria

var arr = [1, 2 ,3, 4, 5];
var newArr = arr.every(function (item, index) {
    return item > 3;
});

console.log(newArr); // false, all satisfaction is true

some: Check if there is a qualified item in the array

var arr = [1, 2 ,3, 4, 5];
var newArr = arr.some(function (item, index) {
    return item > 3;
});

console.log(newArr); // true, not satisfied is false

Keywords: ascii

Added by ransingin on Mon, 08 Jul 2019 00:47:58 +0300

Programming VIP