forEach()
如果有一个数组arr,那么 forEach 方法接收一个函数fn作为参数,然后依次对这个数组的每一项执行这个函数fn,同时这个函数fn又有三个参数,分别为当前值,当前位置,整个数组。也可以理解成value,key,arr.
例如:
var arr = [3,4,5]
arr.forEach(function(value,key,array){console.log('[' + key + '] = ' + value)})
// [0] = 3
// [1] = 4
// [2] = 5
也就是说,forEach方法接受了这个函数,然后这个函数会对数组的每一项都执行,而且必然会接受forEach方法吐给他的这三个参数value,key,还有数组本身。其实这里的三个参数名字叫value,key,array只是为了方便理解,不管你写成什么,这个参数函数在对数组每一项执行的时候,总会接受到数组吐给他的三个参数:当前值,当前位置,整个数组。注意,不管你用不用他,他就是要给你。比如写成
arr.forEach(function(asd,dsa,qwe){console.log('['+ dsa +'] = '+ asd)})
结果是一样的。
还有特别注意,如果这个参数函数的参数只写了一个,比如 arr.forEach ( function( a ){..........................}) 那么这个参数a的值就是数组每一项的value,或者说他的element,或者说“当前的值”。如果这个参数函数的参数只写了两个,那么这两个参数的值就分别是“当前值”和“当前位置”。所以用不到后面一两个的话一般就不写了。
forEach 方法除了接受一个函数作为参数,他还可以接受第二个参数,绑定参数函数的this
变量。
var abc = [];
[1, 2, 3].forEach(function(a){ this.push(a * a) }, abc);
abc // [1, 4, 9]
map()
map() 方法跟 foreach方法很像,不过不同的是它会返回一个数组。map()方法也是接受一个函数作为参数,然后将数组的所有成员依次传入参数函数,然后把每一次的执行结果组成一个新的数组返回。
同样的,这个参数函数也接受三个参数,分别为当前值,当前位置,整个数组,也就是value,key,还有整个数组。
[1, 3, 2].map(function(value, key, arr) {
return value * key;
});
// [0, 3, 4]
map()方法也可以接受第二个参数,用来绑定前一个参数函数内部的this变量。
var arr = ['c', 'b', 'a'];
[1, 2].map(function (i,o,p) {
return this[i];
}, arr)
// ['b', 'a']
[1, 2].map(function (i,o,p) {
return this[o];
}, arr)
// ['c', 'b']
filter()
顾名思义 filter 方法用于过滤数组成员,满足条件的成员组成一个新数组返回。
它的参数是一个函数,所有数组成员依次执行该函数,执行该函数后返回结果为 true 的那些成员组成一个新数组返回。该方法不会改变原数组。
该方法的参数函数同样可以接受三个参数:当前值,当前位置和整个数组。
[1, 2, 3, 4, 5].filter(function (v) {return (v > 4);})
// [5]
forEach方法也同样可以接受第二个参数,绑定参数函数的this变量。不写例子了。
sort()
这个比较简单,sort 方法对数组成员进行排序。排序的方式,比如从大到小还是从小到大,听你安排,看你传入的函数来定。
所以,sort 方法也可以接受一个函数。而这个函数又接受两个参数,这两个参数代表参与比较大小并排序的数组中的前两个成员(因为数组不同于对象,数组是有序的),如果该函数的返回值 return 大于0
,表示第一个成员排在第二个成员后面;否则都是第一个成员排在第二个成员前面。
[2, 4, 3].sort(function (a, b) {
return a - b;
})
// [2, 3, 4]
[2, 4, 3].sort(function (a, b) {
return b - a;
})
// [4, 3, 2]
如果实在记不住没关系,大多数时候换一下 a-b 变成 b-a 就行了,总会有你想要的结果的。
还有复杂点的例子,如果数组的成员不能“直接”比较的话,
[
{ name: "张三", age: 30 },
{ name: "李四", age: 24 },
{ name: "王五", age: 28 }
].sort(function (a, b) {
return a.age - b.age;
})
// [
// { name: "李四", age: 24 },
// { name: "王五", age: 28 },
// { name: "张三", age: 30 }
// ]
reduce(),reduceRight()
reduce 方法和 reduceRight 方法依次处理数组的每个成员,最终累计为一个值。它们的差别是,reduce 是从左到右处理(从第一个成员到最后一个成员),reduceRight 则是从右到左(从最后一个成员到第一个成员),其他完全一样。
[1, 2, 3, 4, 5].reduce(function (a, b) {
console.log(a, b);
return a + b;
})
// 1 2
// 3 3
// 6 4
// 10 5
//return:15
reduce方法和reduceRight方法的第一个参数都是一个函数。该函数接受以下四个参数。
累积值,默认为数组的第一个成员
当前值,默认为数组的第二个成员
当前位置(从0开始)
原数组
这四个参数之中,只有前两个是必须的,后两个则是可选的。
也就是可以这样理解reduce方法,他把每一次处理的结果,作为一个累计值(累计的结果),然后继续和下一个“当前值”做处理。知道遍历完数组,得到一个最终值。
reduce 方法同样接受除了函数之外的第二个参数,作为累计值(也就是前一个参数函数的第一个参数)的初始值,此时,当前值则从数组的第一个成员的值开始计算。
[1, 2, 3, 4, 5].reduce(function (sum, b) {
return sum + b;
}, 3);
// 18
reduce方法还可以用来代替map()和filter()
//map 可以用 reduce 来表示
a=[1,2,3]
a.reduce(function(arr,b){
arr.push(b*2)
return arr },[])
//filter 可以用reduce来表示
a = [1,2,3,4,5,6,7,8,9,10]
a.reduce(function(a,b){
if(b % 2 == 0){
a.push(b)
}
return a
},[])