js Common array methods

It's going to change the array

1.Array.push(), Add one or more elements... To the end of the array , And returns the new array length . It's going to change the array .

let arr = [1,2,3]
let res = arr.push(6) // Returns the length of the array , The original array changes 
console.log(arr) //[ 1, 2, 3, 6 ]
console.log(res) //4 

2.Array.pop(), Delete and return the last element of the array , If the array is empty , Then return to undefined. It's going to change the array .

let arr = [1,2,3]
let res = arr.pop() // Delete the last element of the array , And return the deleted data , The original array changes 
console.log(res) //3
console.log(arr) //[ 1, 2]

3.Array.unshift(), Add one or more elements... To the beginning of the array , And returns the new array length . It's going to change the array .

let arr = [1,2,3]
let res = arr.unshift(1)//  Add one or more elements... To the beginning of the array , And returns the new array length , The original array changes 
console.log(res) //4
console.log(arr) //[ 1, 1, 2, 3]

4.Array.shift(), Delete the first item of the array , And returns the value of the first element . If the array is empty , Then return to undefined. It's going to change the array .

let arr = [1,2,3]
let res = arr.shift()// Delete the first item of the array , And returns the value of the first element 
console.log(res) //1
console.log(arr) //[ 2, 3 ]

5.Array.reverse(), Reverse array . It's going to change the array .

let arr1 = [1,2,3]
let arr2 = [4,5]
let res = arr1.reverse()
console.log(res,typeof res) //   [ 3, 2, 1 ] object
console.log(arr1) //[ 3, 2, 1 ]
console.log(arr2) //[ 4, 5 ]

6.Array.sort(), For the array, follow the string UniCode Code sorting or custom function sorting . It's going to change the array .

let arr1 = ['a1',1,'10','f']
let arr2 = [4,5]
let res = arr1.sort()
console.log(res,typeof res) //   [ 1, '10', 'a1', 'f' ] object
console.log(arr1) //[ 1, '10', 'a1', 'f' ]
console.log(arr2) //[ 4, 5 ]

7.Array.splice(index（ Index of the starting position ）,delNum( Delete the number of elements , by 0 Do not delete ),arr1,arr2…), Add, delete, check and modify the array .arr1,arr2… For the inserted element . It's going to change the array .

let arr1 = ['a1',1,'10','f']
let arr2 = [4,5]
let res = arr1.splice(1,2,3,4,5)
console.log(res) //[ 1, '10' ]
console.log(arr1)//[ 'a1', 3, 4, 5, 'f' ]

It doesn't change the original array

8.Array.concat(arr1,arr2…), Merge two or more arrays , Generate a new array . The original array remains the same .

let arr1 = [1,2,3]
let arr2 = [4,5]
let res = arr1.concat(arr2)
console.log(res) //[ 1, 2, 3, 4, 5 ] // Merge two or more arrays , Generate a new array 
console.log(arr1) //[ 1, 2, 3 ]
console.log(arr2) //[ 4, 5 ]

9.Array.join(), Connect each item of the array with a specified character to form a string . The default connection character is “,” comma . The original array remains the same .

let arr1 = [1,2,3]
let arr2 = [4,5]
let res = arr1.join('/')
console.log(res,typeof res) //   1/2/3 string
console.log(arr1) //[ 1, 2, 3 ]
console.log(arr2) //[ 4, 5 ]

10.Array.includes() Determine whether an array contains a specified value . With the return true, No return false.

let arr1 = ['a1',1,'10','f']
let arr2 = [4,5]
let res = arr1.includes('10')
console.log(res) //true

11.Array.slice(start,end), from start Start , To end( barring end), Intercept these array elements and return to a new array . without end, Then intercept start All subsequent array elements .start and end You can give a negative value （ After adding a minus sign, it is counted backwards ）. The original array remains the same .

let arr1 = ['a1',1,'10','f']
let arr2 = [4,5]
let res = arr1.slice(1)
console.log(res) //[ 1, '10', 'f' ]

12.Array.filter(), Filter the array through custom conditions , The elements that meet the conditions will be returned to a new array .

let arr1 = ['a1',1,'10','f']
let arr2 = [4,5]
let res = arr1.filter((v)=>v>3)
console.log(res) //[ '10' ]
console.log(arr1)//[ 'a1', 1, '10', 'f' ]

13.Array.every(), Judge by custom conditions , If all array elements meet the conditions, return true, Otherwise return to false.

let arr1 = ['a1',1,'10','f']
let arr2 = [4,5]
let res = arr1.every((v)=>v>3)
console.log(res) //false

14.Array.some(), Judge by custom conditions , If an array element satisfies the condition, it returns true, Otherwise return to .

let arr1 = ['a1',1,'10','f']
let arr2 = [4,5]
let res = arr1.some((v)=>v>3)
console.log(res) //true

15.Array.reduce(), Through the callback function, each value in the array ( Let's start with the first element ), Start calculating , Finally, return the final result .

let arr1 = [1,2,3,43]
let arr2 = [4,5]
let res = arr1.reduce((a,b)=> a+b)
console.log(res) //49
console.log(arr1)//[ 1, 2, 3, 43 ]

16.Array.indexOf() Search for elements in the array , And return to where it is . The result is the index of the element , If not, it will return -1.

let arr1 = [1,2,3,43]
let arr2 = [4,5]
let res = arr1.indexOf(1)
console.log(res) //0
console.log(arr1)//[ 1, 2, 3, 43 ]

17.Array.findIndex() Returns the index of the array element that matches the callback function . Only the index of the first eligible element will be returned .

let arr1 = [1,2,3,43,1,3]
let arr2 = [4,5]
let res = arr1.findIndex(item => item>2)
console.log(res) //2
console.log(arr1)//[ 1, 2, 3, 43, 1, 3 ]

18.**Array.find()** Return the array elements that match the callback function . Only the first qualified array element will be returned .

let arr1 = [1,2,3,43,1,3]
let arr2 = [4,5]
let res = arr1.find(item => item>2)
console.log(res) //3
console.log(arr1)//[ 1, 2, 3, 43, 1, 3 ]

19.Array.flat() Nested array to one-dimensional array , The parameters are numbers , Indicates how many dimensional arrays are converted , Parameter is Infinity when , No matter how many dimensional arrays are converted to one-dimensional arrays .

var arr = [1,2,[3,4],[5,6,[7,8]]];
var newArr1 = arr.flat(2);
var newArr2 = arr.flat(Infinity);
console.log(newArr1); // [1,2,3,4,5,6,[7,8]]
console.log(newArr2); // [1,2,3,4,5,6,7,8]

20.**Array.map()** Method , Walk through each item in the array and operate , At the same time, a new array is returned . The original array remains the same .（ similar forEach）.

var arr = [1,2,3,4,5];
var newArr = arr.map(v => v*2);
console.log(newArr); // [2,4,6,8,10]
console.log(arr); // [ 1, 2, 3, 4, 5 ]

21.Array.forEach(), and for The method is the same , Traverse every element in the array , And pass the element value and index into the callback function . The original array remains the same .

var arr = [1,2,3,4,5];
arr.forEach((v) => {
    
	console.log(v); // 1 2 3 4 5
});

ES6 Two new methods have been added

Batch copy method copyWithin(), And the way to fill the array fill().
The functions of these two methods are similar , You need to specify a range on an existing array instance , Include start index , Does not include end index , Using this method does not change the size of the array .

1.Array.fill(), Use fill() Method to insert all or part of the same values into an existing array . The start index is used to specify where to start filling , It's optional . If no end index is provided , Then fill all the way to the end of the array . The negative index starts at the end of the array .

（1） use 1 Fill the entire array

const arr = [0,0,0,0,0]
arr.fill(1);
console.log(arr);//[1,1,1,1,1]
arr.fill(0);
console.log(arr);//[0,0,0,0,0]// Reset to 0

（2） use 2 Fill index is greater than or equal to 2 The elements of

const arr = [0,0,0,0,0]
arr.fill(2,3);
console.log(arr);//[ 0, 0, 0, 2, 2 ]
arr.fill(0);
console.log(arr);//[0,0,0,0,0]// Reset to 0

（3） Use 3 Fill index is greater than or equal to 1 And less than 3 The elements of

const arr = [0,0,0,0,0]
arr.fill(3,1,3);
console.log(arr);//[ 0, 3, 3, 0, 0 ]

（4） use 4 Fill index is greater than or equal to 1 And less than 4 The elements of

const arr = [0,0,0,0,0]
arr.fill(4,1,4);
console.log(arr);//[ 0, 4, 4, 4, 0 ]

Be careful ：fill() Will automatically ignore out of array bounds 、 Zero length and opposite index range .

2.Array.copyWithin(),copyWithin() Will copy part of the contents of the array according to the specified range , Then insert them at the beginning of the specified index .

（1） from arr Copy index in 5 What to start with , Insert into index 0 Starting position

let arr =[0,1,2,3,4,5,6,7,8,9]
arr.copyWithin(0,2);
console.log(arr);//[2, 3, 4, 5, 6,7, 8, 9, 8, 9]

（2） from arr Copy index in 0 Start to index 3 The end of the story , Insert into index 4 Starting place

let arr =[0,1,2,3,4,5,6,7,8,9]
arr.copyWithin(4,0);
console.log(arr);//[0,1,2,3,0,1,2,3,4,5]
arr.copyWithin(2,0,2);
console.log(arr);//[0,1,0,1,0,1,2,3,4,5]

Link to the original text ：https://blog.csdn.net/LiXiu_zhe/article/details/120285176