es6 array method

forEach、map、filter、find、every、some、reduce、entries

1 forEach (callback function)

1.1 Traverse the array without making any changes to the array and return undefined
1.2 Callback function (current element, index of current element, array object to which the current element belongs)

let a = ['a','b','c'];
// 遍历数组a
let b = a.forEach((item, index, arr) => {
    
    
    console.log(item, index, arr);
})
console.log(b);
// a 0  ["a", "b", "c"]
// b 1  ["a", "b", "c"]
// c 2  ["a", "b", "c"]
// undefined

2 map (callback function)

2.1 Process each element in the array to get a new array
2.2 Do not change the structure and data of the original data
2.3 Callback function (current element, index of current element, array object to which the current element belongs)

let a = ['a','b','c'];
// 数组元素后加上当前索引,返回新数组
let b = a.map((item, index, arr) => {
    
    
    console.log(item, index, arr);
    return item + index;
})
console.log(b);
// a 0  ["a", "b", "c"]
// b 1  ["a", "b", "c"]
// c 2  ["a", "b", "c"]
// ["a0", "b1", "c2"]

3 filter (callback function)

3.1 Create a new array. The elements in the new array are checked by checking all elements in the specified array that meet the conditions.
3.2 Do not change the structure and data of the original data.
3.3 Callback function (current element, index of current element, array to which current element belongs) Object)

let a = [11, 21, 31];
// 筛选出小于20的元素
let b = a.filter((item, index, arr) => {
    
    
    console.log(item, index, arr);
    return item < 20;
})
console.log(b);
// 11 0  [11, 21, 31]
// 21 1  [11, 21, 31]
// 31 2  [11, 21, 31]
// [11]

4 find (callback function)

4.1 Return the value of the first element of the array that passed the test (judgment in the function)
4.2 When the element in the array returns true when the test condition is tested, find() returns the element that meets the condition, and the subsequent value will not call the execution function
4.3 If there is no element that meets the conditions, undefined is returned.
4.4 The structure and data of the original data are not changed.
4.5 Callback function (current element, index of current element, array object to which the current element belongs)

let a = [11, 21, 31];
// 找出第一个大于20的元素
let b = a.find((item, index, arr) => {
    
    
    console.log(item, index, arr);
    return item > 20;
})
console.log(b);
// 11 0  [11, 21, 31]
// 21 1  [11, 21, 31]
// 21

// 找出第一个大于40的元素
b = a.find((item, index, arr) => {
    
    
    console.log(item, index, arr);
    return item > 40;
})
console.log(b);
// 11 0  [11, 21, 31]
// 21 1  [11, 21, 31]
// 31 2  [11, 21, 31]
// undefined

5 every (callback function)

5.1 Check whether all elements of the array meet the specified conditions (provided by the function)
5.2 If an element is detected in the array that is not satisfied, the entire expression returns false, and the remaining elements will not be checked again
5.3 If all elements meet the conditions , It returns true.
5.4 Does not change the structure and data of the original data.
5.5 Callback function (current element, index of current element, array object to which current element belongs)

let a = [11, 21, 31];
// 判断数组中元素是否全部小于20
let b = a.every((item, index, arr) => {
    
    
    console.log(item, index, arr);
    return item < 20;
})
console.log(b);
// 11 0  [11, 21, 31]
// 21 1  [11, 21, 31]
// false

// 判断数组中元素是否全部小于40
b = a.find((item, index, arr) => {
    
    
    console.log(item, index, arr);
    return item < 40;
})
console.log(b);
// 11 0  [11, 21, 31]
// 21 1  [11, 21, 31]
// 31 2  [11, 21, 31]
// true

6 some (callback function)

6.1 Check whether there is an element in the array that meets the specified condition (provided by the function)
6.2 If an element meets the condition, the expression returns true, and the remaining elements will not be tested again
6.3 If there is no element that meets the condition, then false
6.4 No change The structure and data of the original data
6.5 Callback function (the current element, the index of the current element, the array object to which the current element belongs)

let a = [11, 21, 31];
// 判断数组中是否存在元素大于20
let b = a.every((item, index, arr) => {
    
    
    console.log(item, index, arr);
    return item > 20;
})
console.log(b);
// 11 0  [11, 21, 31]
// 21 1  [11, 21, 31]
// true

// 判断数组中是否存在元素小于10
b = a.find((item, index, arr) => {
    
    
    console.log(item, index, arr);
    return item < 10;
})
console.log(b);
// 11 0  [11, 21, 31]
// 21 1  [11, 21, 31]
// 31 2  [11, 21, 31]
// false

7 reduce (callback function, the initial value passed to the function)

7.1 Receive a function as an accumulator, and each value in the array (from left to right) is reduced and finally calculated as a value.
7.2 Do not change the structure and data of the original data
7.3 Callback function (initial value/return value after calculation, current element, index of current element, array object to which the current element belongs)

let a = [11, 21, 31];
// 将数组元素累加
let b = a.reduce((sum, item, index, arr) => {
    
    
    console.log(sum, item, index, arr);
    return sum + item;
})
// 11 21 1 [11, 21, 31]
// 32 31 2 [11, 21, 31]
// 63

// 将'a'累加上数组元素
b = a.find((sum, item, index, arr) => {
    
    
    console.log(sum, item, index, arr);
    return sum + item;
}, 'a')
console.log(b);
// a 11 0  [11, 21, 31]
// a11 21 1  [11, 21, 31]
// a1121 31 2  [11, 21, 31]
// a112131

8 entries()

Returns the iterative object of the array, including the key-value pairs of the array
(returns an array, the array element is an array composed of index and value)
[[0, 11
],
[1,21], [2,31],]

let a = [11, 21, 31];
for (let [index, item] of a.entries()) {
    
    
    console.log(index, item);
}
// 0 11
// 1 21
// 2 31

Guess you like

Origin blog.csdn.net/weixin_43915401/article/details/111592936