定義
foreEach()方法:
針對(duì)每一個(gè)元素執(zhí)行提供的函數(shù)硼被。
map()方法:
創(chuàng)建一個(gè)新的數(shù)組蝗碎,其中每一個(gè)元素由調(diào)用數(shù)組中的每一個(gè)元素執(zhí)行提供的函數(shù)得來(lái)喇澡。
區(qū)別
forEach()方法不會(huì)返回執(zhí)行結(jié)果腕侄,而是undefined钦铺。也就是說(shuō)订雾,forEach()會(huì)修改原來(lái)的數(shù)組。而map()方法會(huì)得到一個(gè)新的數(shù)組并返回矛洞。
例子
制作一個(gè)數(shù)組的平方
有如下一個(gè)數(shù)組
let arr =[1,2,3,4,5,6]
下面分別用forEach()和Map()
forEach()
注意洼哎,forEach是不會(huì)返回有意義的值的烫映。
我們?cè)诨卣{(diào)函數(shù)中直接修改arr的值。
arr.forEach((value, key) => {
return arr[key] = value * value;
});
執(zhí)行結(jié)果如下:
Map()
let list = arr.map(value => {
return value * value;
});
執(zhí)行結(jié)果如下:
執(zhí)行速度對(duì)比
forEach()的執(zhí)行速度 < map()的執(zhí)行速度
如何使用
forEach適合于你并不打算改變數(shù)據(jù)的時(shí)候噩峦,而只是想用數(shù)據(jù)做一些事情 – 比如存入數(shù)據(jù)庫(kù)或則打印出來(lái)锭沟。
let arr = ['a', 'b', 'c', 'd'];
arr.forEach((letter) => {
console.log(letter);
});
// a
// b
// c
// d
map()適用于你要改變數(shù)據(jù)值的時(shí)候。不僅僅在于它更快识补,而且返回一個(gè)新的數(shù)組族淮。這樣的優(yōu)點(diǎn)在于你可以使用復(fù)合(composition)(map(), filter(), reduce()等組合使用)來(lái)玩出更多的花樣。
let arr = [1, 2, 3, 4, 5];
let arr2 = arr.map(value => value * value).filter(value => value > 10);
// arr2 = [16, 25]
我們首先使用map將每一個(gè)元素乘以它們自身凭涂,然后緊接著篩選出那些大于10的元素祝辣。最終結(jié)果賦值給arr2。
總結(jié)
forEach()可以做到的東西切油,map()也同樣可以蝙斜。反過(guò)來(lái)也是如此。
map()會(huì)分配內(nèi)存空間存儲(chǔ)新數(shù)組并返回澎胡,forEach()不會(huì)返回?cái)?shù)據(jù)孕荠。
forEach()允許callback更改原始數(shù)組的元素。map()返回新的數(shù)組滤馍。