map
遍历数组中每个元素并返回一个新数组,不改变原始数组,原始数组元素顺序依次处理元素。
示例:
let arr = [1, 2, 3];
let newArr = arr.map((x, y, z) => {
console.log(x, y, z);
// 1 0 [1, 2, 3]
// 2 1 [1, 2, 3]
// 3 2 [1, 2, 3]
return Math.pow(x, 2);
})
console.log('----------');
console.log(newArr); // [1, 4, 9]
- 注意:
map()
不会对空数组进行检测。
forEach
遍历数组中每个元素,并将元素传递给回调函数,但是没有返回值。
- 示例:
let arr = [1, 2, 3];
arr.forEach((x, y, z) => {
console.log(x, y, z);
// 1 0 [1, 2, 3]
// 2 1 [1, 2, 3]
// 3 2 [1, 2, 3]
})
- 注意:
forEach()
对于空数组是不会执行回调函数的。
filter
遍历数组中每个元素返回一个满足返回条件的新数组,起到一个过滤作用。
简单点说就是,新数组中的元素是通过检查指定数组中符合条件的所有元素,不符合条件的元素就会被过滤掉。
示例:
let arr = [1, 2, 3];
let newArr = arr.filter((x, y, z) => {
console.log(x, y, z);
// 1 0 [1, 2, 3]
// 2 1 [1, 2, 3]
// 3 2 [1, 2, 3]
return x > 1;
})
console.log(newArr); // [2, 3]
- 注意:
filter()
不会对空数组进行检测,也不会改变原始数组。
reduce
接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算出一个值。比如,我们计算【1+2+3+4+5=?】时可以用此方法。
示例:
let arr = [1, 2, 3];
let total = arr.reduce((num , arg) => {
console.log(num, arg);
// 1 2
// 3 3
return num + arg;
})
console.log(total); // 6
- 注意:
reduce()
对于空数组是不会执行回调函数的。
find方法:
[1, 4, -1, 10].find(n => n < 0) // -1
- find方法比较好理解,这里的参数n代表数组里的每一项
- 然后find方法内部通过遍历数组里的每一项,找到
<0的这一项( -1 )
。
findIndex方法:
findIndex方法的回调函数可以接受三个参数,依次为当前的值、当前的位置和原数组。看一个例子:
[1, 3, -5, 11].findIndex((value,index,arr) => value < 0) //2
- 在这个例子当中,value代表这个数组的每一项,1,3,-5,11。index代表每一项的索引值,arr代表这个数组
[1, 3, -5, 11]
,然后我们需要返回的是<0
的这一项的索引值,即是2了。
every方法:
let numbers = [2, 4, 10, 4, 8];
let a = numbers.every( (item,index) => {
if(item%2 === 0){
return true
}else{
return false
}
} )
console.log(a) //true
every()
方法必须所有都返回true才会返回true,哪怕有一个false,就会返回false。
some方法:
let numbers = [2, 4, 10, 4, 9];
let b=numbers.some((item,index) => {
if(item%3 === 0){
return true
}else{
return false
}
})
console.log(b) //true
some方法 只要其中一个为true 就会返回true的。
every()和 some()
目的:确定数组的所有成员是否满足指定的条件
总结
- map 和 filter 都是 immutable methods,也就是说它们只会返回一个新数组,而不会改变原来的那个数组。