es6 map、foreach、reduce、 filter 詳解

sky_Bosco發表於2018-01-16
forEach:

假設我們有一個陣列,每個元素是一個人。你面前站了一排

foreach 就是你按順序一個一個跟他們做點什麼,具體做什麼,隨便:

people.forEach(function (dude,index) {
  dude.pickUpSoap();
});複製程式碼
Map:

map 就是你手裡拿一個盒子(一個新的陣列),一個一個叫他們把錢包扔進去。結束的時候你獲得了一個新的陣列,裡面是大家的錢包,錢包的順序和人的順序一一對應。

var wallets = people.map(function (dude) {
  return dude.wallet;
});複製程式碼
reduce:

 就是你拿著錢包,一個一個數過去看裡面有多少錢啊?每檢查一個,你就和前面的總和加一起來。這樣結束的時候你就知道大家總共有多少錢了。

var totalMoney = wallets.reduce(function (countedMoney, wallet) {
  return countedMoney + wallet.money;
}, 0);// countedMoney 開始接收0 複製程式碼

補充一個 filter 的:
你一個個錢包數過去的時候,裡面錢少於 100 塊的不要(留在原來的盒子裡),多於 100 塊的丟到一個新的盒子裡。這樣結束的時候你又有了一個新的陣列,裡面是所有錢多於 100 塊的錢包:

var fatWallets = wallets.filter(function (wallet) {
  return wallet.money > 100;
});複製程式碼

最後要說明一點這個類比和實際程式碼的一個區別,

那就是 map 和 filter 都是 immutable methods,也就是說它們只會返回一個新陣列,而不會改變原來的那個陣列,所以這裡 filter 的例子是和程式碼有些出入的(原來的盒子裡的錢包減少了),但為了形象說明,大家理解就好.


相關文章