es6 array方法

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

1 forEach(回调函数)

1.1 遍历数组,对数组没做任何改变,返回undefined
1.2 回调函数(当前元素,当前元素的索引,当前元素所属的数组对象)

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(回调函数)

2.1 对数组中的每个元素进行处理,得到新的数组
2.2 不改变原有数据的结构和数据
2.3 回调函数(当前元素,当前元素的索引,当前元素所属的数组对象)

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(回调函数)

3.1 创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素
3.2 不改变原有数据的结构和数据
3.3 回调函数(当前元素,当前元素的索引,当前元素所属的数组对象)

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(回调函数)

4.1 返回通过测试(函数内判断)的数组的第一个元素的值
4.2 当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素,之后的值不会再调用执行函数
4.3 如果没有符合条件的元素返回 undefined
4.4 不改变原有数据的结构和数据
4.5 回调函数(当前元素,当前元素的索引,当前元素所属的数组对象)

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(回调函数)

5.1 检测数组所有元素是否都符合指定条件(通过函数提供)
5.2 如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测
5.3 如果所有元素都满足条件,则返回 true
5.4 不改变原有数据的结构和数据
5.5 回调函数(当前元素,当前元素的索引,当前元素所属的数组对象)

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(回调函数)

6.1 检测数组中是否有元素满足指定条件(函数提供)
6.2 如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测
6.3 如果没有满足条件的元素,则返回false
6.4 不改变原有数据的结构和数据
6.5 回调函数(当前元素,当前元素的索引,当前元素所属的数组对象)

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(回调函数,传递给函数的初始值)

7.1 接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。
7.2 不改变原有数据的结构和数据
7.3 回调函数(初始值/计算结束后的返回值,当前元素,当前元素的索引,当前元素所属的数组对象)

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()

返回数组的迭代对象,包含数组的键值对
(返回一个数组,数组元素是index和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

猜你喜欢

转载自blog.csdn.net/weixin_43915401/article/details/111592936