Array array
1. Introduction
An array is an ordered collection of values. Each value is called an element, and each element has a position in the array, represented by a number, called an index. JavaScript arrays are of no type: array elements can be of any type, and different elements in the same array may also have different types. --"Authoritative Guide to JavaScript (Sixth Edition)"
2. Definition
The code copy is as follows:
var names = new Array("Zhang San", "Li Si", "Wang Wu");
//or
var names = ["Zhang San", "Li Si", "Wang Wu"];
3. Properties
length: represents the length of the element in the array.
4. Example method
Common methods:
1) unshift(): Insert element at the head of the array
2) shift(): Remove and return the first element of the array
3) push(): Insert element at the end of the array
4) pop(): Remove and return the last element of the array
4.1 concat(): Connect elements to array. The original array will not be modified, and the new array will be returned.
parameter:
①value1,value2...valueN: any number of values
Return value:
{Array} A new array containing the original Array and newly added elements.
Example:
The code copy is as follows:
var demoArray = ['a', 'b', 'c'];
var demoArray2 = demoArray.concat('e');
console.log(demoArray); // => demoArray:['a','b','c'] The original array does not change
console.log(demoArray2); // => ['a','b','c','e']
4.2 every(): traverse the elements in turn to determine whether each element is true
parameter:
① function(value,index,self){}: Each element will use this function to determine whether it is true. When it is judged that one is false, the traversal will be immediately ended.
value: The element of the array traversal
index: element number
self: Array itself
Return value:
{Boolean}: Return true only if each element is true; if one is false, return false.
Example:
The code copy is as follows:
var demoArray = [1, 2, 3];
var rs = demoArray.every(function (value, index, self) {
return value > 0;
});
console.log(rs); // => true
4.3 filter(): traverse the elements in turn and return a new array containing elements that meet the criteria.
parameter:
① function(value,index,self){}: Each element calls this function in turn, returning a new array containing elements that meet the criteria.
value: The element of the array traversal
index: element number
self: Array itself
Return value:
{Array} A new array containing elements that match the criteria
Example:
The code copy is as follows:
var demoArray = [1, 2, 3];
var rs = demoArray.filter(function (value, index, self) {
return value > 0;
});
console.log(rs); // => [1, 2, 3]
4.4 forEach(): traverse elements in sequence and execute the specified function; no return value.
parameter:
① function(value,index,self){}: Each element calls this function in turn
value: The element of the array traversal
index: element number
self: Array itself
Return value: None
Example:
The code copy is as follows:
var demoArray = [1, 2, 3];
demoArray.forEach(function (value, index, self) {
console.log(value); // => Output in sequence: 1 2 3
});
4.5 indexOf(): Find matching elements in an array. If no matching element exists, return -1. Use the "===" operator when searching, so you need to distinguish between 1 and '1'
parameter:
①value: The value to be found in the array.
②start: The serial number position that starts searching, if omitted, it is 0.
Return value:
{Int}: Returns the first matching value in the array. If it does not exist, return -1
Example:
The code copy is as follows:
['a', 'b', 'c'].indexOf('a'); // =>0
['a', 'b', 'c'].indexOf('a', 1); // =>-1
['a', 'b', 'c'].indexOf('d'); // =>-1
[1, 2, 3].indexOf('1'); // => -1: The '===' matching method used
4.6 join(): splice all elements in the array into a string through a delimiter.
parameter:
①sparator {String}: The separator between each element. If omitted, it is separated by the English comma ',' by default.
Return value:
{String}: A string spliced by each element with a sparator as a separator.
Example:
The code copy is as follows:
['a', 'b', 'c'].join(); // => 'a,b,c'
['a', 'b', 'c'].join('-'); // => 'ab-c'
4.7 lastIndexOf: Reversely look up matching elements in an array. If no matching element exists, return -1. Use the "===" operator when searching, so you need to distinguish between 1 and '1'
parameter:
①value: The value to be found in the array.
②start: The position of the sequence number that starts searching. If omitted, start searching from the last element.
Return value:
{Int}: Start to find the first matching value in the array from right to left. If it does not exist, return -1
Example:
The code copy is as follows:
['a', 'b', 'c'].lastIndexOf('a'); // => 0
['a', 'b', 'c'].lastIndexOf('a', 1); // => 0
['a', 'b', 'c'].lastIndexOf('d'); // => -1
[1, 2, 3].lastIndexOf('1'); // => -1: The '===' matching method used
4.8 map(): Iterate over and calculate each element in sequence, and return the calculated array of elements
parameter:
① function(value,index,self){}: Each element calls this function in turn to return the calculated element
value: The element of the array traversal
index: element number
self: Array itself
Return value:
{Array} A new array containing even good elements
Example:
The code copy is as follows:
[1, 2, 3].map(function (value, index, self) {
return value * 2;
}); // => [2, 4, 6]
4.9 pop(): Remove and return the last element of the array
Parameters: None
Return value:
{Object} The last element of the array; if the array is empty, return undefined
Example:
The code copy is as follows:
var demoArray = ['a', 'b', 'c'];
demoArray.pop(); // => c
demoArray.pop(); // => b
demoArray.pop(); // => a
demoArray.pop(); // => undefined
4.10 push(): Add elements to the end of the array
parameter:
①value1,value2...valueN: Add any number of values to the end of the array
Return value:
{int} The new length of the array
Example:
The code copy is as follows:
var demoArray = ['a', 'b', 'c'];
demoArray.push('d'); // => 4, demoArray : ['a', 'b', 'c', 'd']
demoArray.push('e', 'f'); // => 6, demoArray : ['a', 'b', 'c', 'd', 'e', 'f']
console.log(demoArray); // => ['a', 'b', 'c', 'd', 'e', 'f']
4.11 reverse(): Invert the order of array elements.
Parameters: None
Return value: None (invert element order in the original array).
Example:
The code copy is as follows:
var demoArray = ['a', 'b', 'c', 'd', 'e'];
demoArray.reverse();
console.log(demoArray); // => ["e", "d", "c", "b", "a"]
4.12 shift(): Remove and return the first element of the array
Parameters: None
Return value:
{Object} The first element of the array; if the array is empty, undefined is returned.
Example:
The code copy is as follows:
var demoArray = ['a', 'b', 'c'];
demoArray.shift(); // => a
demoArray.shift(); // => b
demoArray.shift(); // => c
demoArray.shift(); // => undefined
4.13 slice(startIndex,endIndex): Returns part of the array.
parameter:
① startIndex: the sequence number at the beginning; if it is a negative number, it means that the calculation starts from the end, -1 represents the last element, -2 is the second to last, and so on.
②endIndex: The last sequence number of the element at the end, if not specified, the end is the end. The intercepted element does not contain the element with the sequence number here, and the ending is the previous element with the sequence number here.
Return value:
{Array} A new array containing all elements from startIndex to the previous element of the endIndex.
Example:
The code copy is as follows:
[1, 2, 3, 4, 5, 6].slice(); // => [1, 2, 3, 4, 5, 6]
[1, 2, 3, 4, 5, 6].slice(1); // => [2, 3, 4, 5, 6]: Starting from serial number 1
[1, 2, 3, 4, 5, 6].slice(0, 4); // => [1, 2, 3, 4]: Intercept the element of serial number 0 to serial number 3 (the previous one of serial number 4)
[1, 2, 3, 4, 5, 6].slice(-2); // => [5, 6]: Intercept the next 2 elements
4.14 sort(opt_orderFunc): sort according to certain rules
parameter:
① opt_orderFunc(v1,v2) {Function}: optional sorting rule function. If omitted, the letters of the element will be sorted from small to large.
v1: The previous element is traversed.
v2: The following elements are traversed.
Sorting rules:
Compare v1 and v2 and return a number to represent the sorting rules of v1 and v2:
Less than 0: v1 is less than v2, v1 is ahead of v2.
Equal to 0: v1 equals v2, v1 is ahead of v2.
Greater than 0: v1 is greater than v2, v1 is behind v2.
Return value: None (sorting operations in the original array).
Example:
The code copy is as follows:
[1, 3, 5, 2, 4, 11, 22].sort(); // => [1, 11, 2, 22, 3, 4, 5]: All elements are converted into characters, and the characters of 11 are before 2
[1, 3, 5, 2, 4, 11, 22].sort(function (v1, v2) {
return v1 - v2;
}); // => [1, 2, 3, 4, 5, 11, 22] : sorted from small to large
[1, 3, 5, 2, 4, 11, 22].sort(function (v1, v2) {
return -(v1 - v2); //Inverse, you can convert from large to small
}); // => [22, 11, 5, 4, 3, 2, 1]
4.15 splice(): Insert and delete array elements
parameter:
① start {int}: The starting sequence number to start inserting, deleting or replacing.
②deleteCount {int}: The number of elements to be deleted, start calculation from start.
③value1,value2 ... valueN {Object}: Optional parameter, indicating the element to be inserted, and it starts to insert from start. If the parameter ② is not 0, then perform the delete operation first and then perform the insert operation.
Return value:
{Array} Returns a new array containing deleted elements. If the parameter ② is 0, it means that no element is deleted and an empty array is returned.
Example:
The code copy is as follows:
// 1. Delete
var demoArray = ['a', 'b', 'c', 'd', 'e'];
var demoArray2 = demoArray.splice(0, 2); // Delete 2 elements starting from 0 from the sequence number and return an array containing the deleted elements: ['a', 'b']
console.log(demoArray2); // => ['a', 'b']
console.log(demoArray); // => ['c', 'd', 'e']
// 2. Insert
var demoArray = ['a', 'b', 'c', 'd', 'e'];
var demoArray2 = demoArray.splice(0, 0, '1', '2', '3'); // ② The parameter is 0, returns an empty array
console.log(demoArray2); // => [ ]
console.log(demoArray); // => ['1', '2', '3', 'a', 'b', 'c', 'd', 'e']
// 3. Delete first and then insert
var demoArray = ['a', 'b', 'c', 'd', 'e'];
// When the ② parameter is not 0, then perform the deletion operation first (delete 4 elements with sequence number starting from 0, return an array containing the deleted elements), and then perform the insertion operation
var demoArray2 = demoArray.splice(0, 4, '1', '2', '3');
console.log(demoArray2); // => ['a', 'b', 'c', 'd']
console.log(demoArray); // => ['1', '2', '3', 'a', 'b', 'c', 'd', 'e']
4.16 toString(): Stitch all elements in the array into a string through an English comma ','.
Parameters: None
Return value:
{String} All elements in the array are spliced into a string by an English comma ',' and returned. The same is to call the join() method without parameters.
Example:
The code copy is as follows:
[1, 2, 3, 4, 5].toString(); // => '1,2,3,4,5'
['a', 'b', 'c', 'd', 'e'].toString(); // => 'a,b,c,d,e'
4.17 unshift(): Insert element at the head of the array
parameter:
①value1,value2...valueN: Add any number of values to the header of the array
Return value:
{int} The new length of the array
Example:
The code copy is as follows:
var demoArray = [];
demoArray.unshift('a'); // => demoArray:['a']
demoArray.unshift('b'); // => demoArray:['b', 'a']
demoArray.unshift('c'); // => demoArray:['c', 'b', 'a']
demoArray.unshift('d'); // => demoArray:['d', 'c', 'b', 'a']
demoArray.unshift('e'); // => demoArray:['e', 'd', 'c', 'b', 'a']
5. Static method
5.1 Array.isArray(): determines whether the object is an array
parameter:
①value {Object}: any object
Return value:
{Boolean} Returns the judgment result. When true, it means that the object is an array; when false, it means that the object is not an array
Example:
The code copy is as follows:
Array.isArray([]); // => true
Array.isArray(['a', 'b', 'c']); // => true
Array.isArray('a'); // => false
Array.isArray('[1, 2, 3]'); // => false
6. Practical operation
6.1 Index
Description: Each element has a position in the array, represented by a number, called an index. The index starts from 0, that is, the index of the first element is 0, the index of the second element is 1, and so on;
When obtaining an index that does not exist in an array, undefined is returned.
Example:
The code copy is as follows:
var demoArray = ['a', 'b', 'c', 'd', 'e'];
demoArray[0]; // => Get the first element:'a'
demoArray[0] = 1; // Set the first element to 1
console.log(demoArray); // => demoArray:[1, 'b', 'c', 'd', 'e']
console.log(demoArray[9]); // => undefined: Return undefined when the obtained index does not exist
6.2 for statements
Note: You can traverse the array one by one through the for statement
Example:
The code copy is as follows:
var demoArray = ['a', 'b', 'c', 'd', 'e'];
for (var i = 0, length = demoArray.length; i < length; i++) {
console.log(demoArray[i]); // => Output elements in the array one by one
}
6.3 shallow copy
Note: The Array type is a reference type; when array a is copied to array b, element modification is made to array b, and array a will also be modified.
Example:
The code copy is as follows:
var demoArrayA = ['a', 'b', 'c', 'd', 'e'];
var demoArrayB = demoArrayA; // Assign array A to array B
demoArrayB[0] = 1; // Modify elements of array B
console.log(demoArrayA); // => [1, 'b', 'c', 'd', 'e']: The elements of array A have also changed
6.4 Deep Copy
Note: Use the concat() method to return a new array; prevent shallow copying, perform element modification operations on array b, and array a will not change.
Example:
The code copy is as follows:
var demoArrayA = ['a', 'b', 'c', 'd', 'e'];
var demoArrayB = demoArrayA.concat(); // Use concat() method to return a new array
demoArrayB[0] = 1; // Modify elements of array B
console.log(demoArrayA); // => ['a', 'b', 'c', 'd', 'e']: The elements of array A have not changed
console.log(demoArrayB); // => [ 1, 'b', 'c', 'd', 'e']: The element of array B has changed