map()
map()方法按照原始数组元素顺序依次处理元素,返回一个新的数组,数组中的元素为原始数组调用函数处理后的值。可看作是对原数组进行映射。
注意:map()方法不会对空数组进行检测。
array.map(function(currentValue,index,arr), thisValue) //参数:当前元素、当前元素的索引、当前元素所属的数组 var wallets = people.map(function (dude) { return dude.wallet; });
forEach()
forEach()方法用于遍历数组的每个元素,将元素传给回调函数。
注意:forEach()对于空数组是不会调用回调函数的。
array.forEach(function(currentValue, index, arr), thisValue) //参数:当前元素、当前元素的索引、当前元素所属的数组 people.forEach(function (dude) { dude.pickUpSoap(); });
reduce()
reduce()方法是让数组中的前项和后项做某种计算,并累计最终值。
array.reduce(function(total, currentValue, currentIndex, arr), initialValue)初始值 //参数:初始值(计算结束的返回值)、当前元素、当前元素的索引、当前元素所属的数组 var totalMoney = wallets.reduce(function (countedMoney, wallet) { return countedMoney + wallet.money; }, 0);
filter()
filter()方法会筛选出数组中符合条件的项,组成一个新数组。
array.filter(function(currentValue,index,arr), thisValue) //参数:当前元素、当前元素的索引、当前元素所属的数组 var fatWallets = wallets.filter(function (wallet) { return wallet.money > 100; });
总结
- 相同点:
- 都会循环遍历数组中的每一项;
- map()、forEach()和filter()方法里每次执行匿名函数都支持3个参数,参数分别是:当前元素、当前元素的索引、当前元素所属的数组;
- 匿名函数中的this都是指向window;
- 只能遍历数组。
- 不同点:
- map()速度比forEach()快;
- map()和filter()会返回一个新数组,不对原数组产生影响;forEach()不会产生新数组,返回undefined;reduce()函数是把数组缩减为一个值(比如求和、求积);
- map()里可以用return,而forEach()里用return不起作用,forEach()不能用break,会直接报错;
- reduce()有4个参数,第一个参数为初始值。
参考文章: