The following methods change the value of the original array on which they are called
push()
The push() method adds one or more elements to the end of an array and returns the new length of the array.
// 语法：arr.push(element1, ..., elementN)
let arr = [1, 2, 3];
let count = arr.push(4);
console.log(count); // 4
console.log(arr); // [1, 2, 3, 4]
pop()
The pop() method removes the last element from the array and returns the value of that element. This method changes the length of the array.
// 语法：arr.pop()
let arr = [1, 2, 3, 4];
let count = arr.pop();
console.log(count); // 4
console.log(arr); // [1, 2, 3]
shift()
The shift() method removes the first element from the array and returns the value of that element. This method changes the length of the array.
// 语法：arr.shift()
let arr = [1, 2, 3, 4];
let count = arr.shift();
console.log(count); // 1
console.log(arr); // [2, 3, 4]
unshift()
The unshift() method adds one or more elements to the beginning of the array and returns the new length of the array (this method modifies the original array).
// 语法：arr.unshift(element1, ..., elementN)
let arr = [1, 2, 3, 4];
let count = arr.unshift(0);
console.log(count); // 5
console.log(arr); // [0, 1, 2, 3, 4]
splice()
The splice() method modifies the array by deleting or replacing existing elements or adding new elements in place, and returns the modified content in the form of an array. This method mutates the original array.
// 语法：array.splice(start[, deleteCount[, item1[, item2[, ...]]]])
let arr = [1, 2, 3, 4];
arr.splice(1, 0, 5);
console.log(arr); // [1, 5, 2, 3, 4]
arr.splice(4, 1, 6);
console.log(arr); // [1, 5, 2, 3, 6]
arr.splice(4, 1, 6, 7, 8);
console.log(arr); // [1, 5, 2, 3, 6, 7, 8]
reverse()
The reverse() method reverses the position of the elements in the array and returns the array. The first element of the array becomes the last, and the last element of the array becomes the first. This method will change the original array.
// 语法：arr.reverse()
let arr1 = [1, 2, 3];
let arr2 = arr1.reverse();
console.log(arr2); // [3, 2, 1]
console.log(arr1); // [3, 2, 1]
fill()
The fill() method fills all elements in an array from the start index to the end index with a fixed value. Does not include terminating index.
// 语法：arr.fill(value[, start[, end]])
let arr = [1, 2, 3, 4];
arr.fill(0, 2, 4)
console.log(arr); // [1, 2, 0, 0];
copyWithin()
The copyWithin() method shallow copies a part of an array to another location in the same array and returns it without changing the length of the original array.
// 语法：arr.copyWithin(target[, start[, end]])
let arr1 = [1, 2, 3, 4];
let arr2 = arr1.copyWithin(0, 3, 4);
console.log(arr2); // [4, 2, 3, 4]
console.log(arr1); // [4, 2, 3, 4]
The methods below never change the value of the object on which they are called, they just return a new array or some other desired value.
concat()
The concat() method is used to combine two or more arrays. This method does not alter the existing array, but returns a new array.
// 语法：var new_array = old_array.concat(value1[, value2[, ...[, valueN]]])
const arr1 = [1, 2, 3];
const arr2 = [4, 5, 6];
const arr3 = arr1.concat(arr2);
console.log(arr3); // [1, 2, 3, 4, 5, 6]
console.log(arr1); // [1, 2, 3]
console.log(arr2); // [4, 5, 6]
includes()
The includes() method is used to determine whether an array contains a specified value. According to the situation, if it is included, it returns true, otherwise it returns false.
// 语法：arr.includes(valueToFind[, fromIndex])
const arr = [1, 2, 3, 4, 5];
const bool1 = arr.includes(1);
const bool2 = arr.includes(0);
const bool3 = arr.includes(1, 2);
console.log(bool1); // true
console.log(bool2); // false
console.log(bool3); // false
join()
The join() method joins all elements of an array (or an array-like object) into a string and returns the string. If the array has only one item, that item will be returned without a separator.
// 语法：arr.join([separator])
const arr1 = [10, 30, 50];
const time = arr1.join(':');
console.log(time); // 10:30:50
slice()
The slice() method returns a new array object, which is a shallow copy of the original array determined by begin and end (including begin, excluding end). The original array will not be changed.
// 语法：arr.slice([begin[, end]])
const arr1 = [1, 2, 3, 4, 5];
const arr2 = arr1.slice(2);
const arr3 = arr1.slice(1,3);
console.log(arr2); // [3, 4, 5]
console.log(arr3); // [2, 3]
console.log(arr1); // [1, 2, 3, 4, 5]
indexOf()
The indexOf() method returns the first index in the array where a given element can be found, or -1 if it does not exist.
// 语法：arr.indexOf(searchElement[, fromIndex])
const arr = [1, 2, 3, 4, 5];
const index = arr.indexOf(4);
console.log(index) // 3
lastIndexOf()
The lastIndexOf() method returns the last index in the array of the specified element (that is, a valid JavaScript value or variable), or -1 if it does not exist. Look forward from the back of the array, starting from fromIndex.
// 语法：arr.lastIndexOf(searchElement[, fromIndex])
const arr = [1, 2, 5, 3, 4, 5];
const index1 = arr.lastIndexOf(5);
const index2 = arr.lastIndexOf(5, 4);
console.log(index1) // 5
console.log(index2) // 2
iterative method
forEach()
The forEach() method executes the given function once for each element of the array.
// 语法：arr.forEach(callback(currentValue [, index [, array]])[, thisArg])
const arr = [1, 2, 3];
arr.forEach(item => console.log(item));
// 1
// 2
// 3
map()
The map() method creates a new array whose result is that each element in the array is the return value of one call to the provided function.
// 语法：var new_array = arr.map(function callback(currentValue[, index[, array]]) {
// Return element for new_array
// }[, thisArg])
const arr1 = [1, 2, 3];
const arr2 = arr1.map(x => x * 2);
console.log(arr2); // [2, 4, 6]
filter()
The filter() method creates a new array containing all the elements that pass the tests fulfilled by the provided function.
// 语法：var newArray = arr.filter(callback(element[, index[, array]])[, thisArg])
const arr1 = [1, 2, 3, 4, 5];
const arr2 = arr1.filter(x => x > 2);
console.log(arr2); // [3, 4, 5]
every()
The every() method tests whether all elements in an array pass the test of a specified function. It returns a boolean value.
// 语法：arr.every(callback(element[, index[, array]])[, thisArg])
const arr1 = [1, 2, 3, 4, 5];
const bool1 = arr1.every(x => x > 2);
const bool2 = arr1.every(x => x < 6);
console.log(bool1); // false
console.log(bool2); // true
some()
The some() method tests whether at least 1 element in the array passes the provided function test. It returns a value of type Boolean.
// 语法：arr.some(callback(element[, index[, array]])[, thisArg])
const arr1 = [1, 2, 3, 4, 5];
const bool1 = arr1.some(x => x > 2);
const bool2 = arr1.some(x => x > 6);
console.log(bool1); // true
console.log(bool2); // false
find()
The find() method returns the value of the first element in the array that satisfies the provided test function. Otherwise returns undefined.
// 语法：arr.some(callback(element[, index[, array]])[, thisArg])
const arr1 = [1, 2, 3, 4, 5];
const count1 = arr1.find(x => x > 2);
const count2 = arr1.find(x => x > 6);
console.log(count1); // 3
console.log(count2); // undefined。
findIndex()
The findIndex() method returns the value of the first element in the array that satisfies the provided test function. Otherwise returns undefined.
// 语法：arr.findIndex(callback[, thisArg])
const arr1 = [1, 2, 3, 4, 5];
const index1 = arr1.findIndex(x => x > 2);
const index2 = arr1.findIndex(x => x > 6);
console.log(index1); // 2
console.log(index2); // -1
reduce()
The reduce() method executes a reducer function provided by you (in ascending order) on each element in the array, aggregating its results into a single return value.
// 语法：arr.reduce(callback(accumulator, currentValue[, index[, array]])[, initialValue])
const arr = [1, 2, 3, 4, 5];
const res = arr.reduce((acc, cur) => acc + cur);
console.log(res); // 15