摘要：我們要進(jìn)行一個(gè)奇數(shù)的篩選，所以我們這么寫(xiě)然后我們改為版本這會(huì)導(dǎo)致我們的篩選功能失效，因?yàn)榈姆祷刂灯ヅ洳皇峭耆嗟鹊钠ヅ洌灰欠祷刂的苻D(zhuǎn)換為，就會(huì)被認(rèn)定為通過(guò)篩選。

這里指的遍歷方法包括：map、reduce、reduceRight、forEach、filter、some、every
因?yàn)樽罱M(jìn)行了一些數(shù)據(jù)匯總，node版本已經(jīng)是8.11.1了，所以直接寫(xiě)了個(gè)async/await的腳本。
但是在對(duì)數(shù)組進(jìn)行一些遍歷操作時(shí)，發(fā)現(xiàn)有些遍歷方法對(duì)Promise的反饋并不是我們想要的結(jié)果。

當(dāng)然，有些嚴(yán)格來(lái)講并不能算是遍歷，比如說(shuō)some，every這些的。
但確實(shí)，這些都會(huì)根據(jù)我們數(shù)組的元素來(lái)進(jìn)行多次的調(diào)用傳入的回調(diào)。

這些方法都是比較常見(jiàn)的，但是當(dāng)你的回調(diào)函數(shù)是一個(gè)Promise時(shí)，一切都變了。

async/await為Promise的語(yǔ)法糖
文中會(huì)直接使用async/await替換Promise

let result = await func()
// => 等價(jià)于
func().then(result => {
  // code here
})

// ======

async function func () {
  return 1  
}
// => 等價(jià)與
function func () {
  return new Promise(resolve => resolve(1))
}

map可以說(shuō)是對(duì)Promise最友好的一個(gè)函數(shù)了。
我們都知道，map接收兩個(gè)參數(shù)：

對(duì)每項(xiàng)元素執(zhí)行的回調(diào)，回調(diào)結(jié)果的返回值將作為該數(shù)組中相應(yīng)下標(biāo)的元素

一個(gè)可選的回調(diào)函數(shù)this指向的參數(shù)

[1, 2, 3].map(item => item ** 2) // 對(duì)數(shù)組元素進(jìn)行求平方
// > [1, 4, 9]

上邊是一個(gè)普通的map執(zhí)行，但是當(dāng)我們的一些計(jì)算操作變?yōu)楫惒降模?/p>

[1, 2, 3].map(async item => item ** 2) // 對(duì)數(shù)組元素進(jìn)行求平方
// > [Promise, Promise, Promise]

這時(shí)候，我們獲取到的返回值其實(shí)就是一個(gè)由Promise函數(shù)組成的數(shù)組了。

所以為什么上邊說(shuō)map函數(shù)為最友好的，因?yàn)槲覀冎溃?b>Promise有一個(gè)函數(shù)為Promise.all
會(huì)將一個(gè)由Promise組成的數(shù)組依次執(zhí)行，并返回一個(gè)Promise對(duì)象，該對(duì)象的結(jié)果為數(shù)組產(chǎn)生的結(jié)果集。

await Promise.all([1, 2, 3].map(async item => item ** 2))
// > [1, 4, 9]

首先使用Promise.all對(duì)數(shù)組進(jìn)行包裝，然后用await獲取結(jié)果。

reduce的函數(shù)簽名想必大家也很熟悉了，接收兩個(gè)參數(shù)：

對(duì)每一項(xiàng)元素執(zhí)行的回調(diào)函數(shù)，返回值將被累加到下次函數(shù)調(diào)用中，回調(diào)函數(shù)的簽名：

accumulator累加的值

currentValue當(dāng)前正在處理的元素

currentIndex當(dāng)前正在處理的元素下標(biāo)

array調(diào)用reduce的數(shù)組

可選的初始化的值，將作為accumulator的初始值

[1, 2, 3].reduce((accumulator, item) => accumulator + item, 0) // 進(jìn)行加和
// > 6

這個(gè)代碼也是沒(méi)毛病的，同樣如果我們加和的操作也是個(gè)異步的：

[1, 2, 3].reduce(async (accumulator, item) => accumulator + item, 0) // 進(jìn)行加和
// > Promise?{: "[object Promise]3"}

這個(gè)結(jié)果返回的就會(huì)很詭異了，我們?cè)诨乜瓷线叺?b>reduce的函數(shù)簽名

對(duì)每一項(xiàng)元素執(zhí)行的回調(diào)函數(shù)，返回值將被累加到下次函數(shù)調(diào)用中

然后我們?cè)賮?lái)看代碼，async (accumulator, item) => accumulator += item
這個(gè)在最開(kāi)始也提到了，是Pormise的語(yǔ)法糖，為了看得更清晰，我們可以這樣寫(xiě)：

(accumulator, item) => new Promise(resolve =>
  resolve(accumulator += item)
)

也就是說(shuō)，我們reduce的回調(diào)函數(shù)返回值其實(shí)就是一個(gè)Promise對(duì)象
然后我們對(duì)Promise對(duì)象進(jìn)行+=操作，得到那樣怪異的返回值也就很合情合理了。

當(dāng)然，reduce的調(diào)整也是很輕松的：

await [1, 2, 3].reduce(async (accumulator, item) => await accumulator + item, 0)
// > 6

我們對(duì)accumulator調(diào)用await，然后再與當(dāng)前item進(jìn)行加和，在最后我們的reduce返回值也一定是一個(gè)Promise，所以我們?cè)谧钔膺呉蔡砑?b>await的字樣
也就是說(shuō)我們每次reduce都會(huì)返回一個(gè)新的Promise對(duì)象，在對(duì)象內(nèi)部都會(huì)獲取上次Promise的結(jié)果。
我們調(diào)用reduce實(shí)際上得到的是類(lèi)似這樣的一個(gè)Promise對(duì)象：

new Promise(resolve => {
  let item = 3
  new Promise(resolve => {
      let item = 2
      new Promise(resolve => {
        let item = 1
        Promise.resolve(0).then(result => resolve(item + result))
      }).then(result => resolve(item + result))
  }).then(result => resolve(item + result))
})

這個(gè)就沒(méi)什么好說(shuō)的了。。跟reduce只是執(zhí)行順序相反而已

forEach，這個(gè)應(yīng)該是用得最多的遍歷方法了，對(duì)應(yīng)的函數(shù)簽名：

callback，對(duì)每一個(gè)元素進(jìn)行調(diào)用的函數(shù)

currentValue，當(dāng)前元素

index，當(dāng)前元素下標(biāo)

array，調(diào)用forEach的數(shù)組引用

thisArg，一個(gè)可選的回調(diào)函數(shù)this指向

我們有如下的操作：

// 獲取數(shù)組元素求平方后的值
[1, 2, 3].forEach(item => {
  console.log(item ** 2)
})
// > 1
// > 4
// > 9

普通版本我們是可以直接這么輸出的，但是如果遇到了Promise

// 獲取數(shù)組元素求平方后的值
[1, 2, 3].forEach(async item => {
  console.log(item ** 2)
})
// > nothing

forEach并不關(guān)心回調(diào)函數(shù)的返回值，所以forEach只是執(zhí)行了三個(gè)會(huì)返回Promise的函數(shù)
所以如果我們想要得到想要的效果，只能夠自己進(jìn)行增強(qiáng)對(duì)象屬性了：

Array.prototype.forEachSync = async function (callback, thisArg) {
  for (let [index, item] of Object.entries(this)) {
    await callback(item, index, this)
  }
}

await [1, 2, 3].forEachSync(async item => {
  console.log(item ** 2)
})

// > 1
// > 4
// > 9

await會(huì)忽略非Promise值，await 0、await undefined與普通代碼無(wú)異

filter作為一個(gè)篩選數(shù)組用的函數(shù)，同樣具有遍歷的功能：
函數(shù)簽名同forEach，但是callback返回值為true的元素將被放到filter函數(shù)返回值中去。

我們要進(jìn)行一個(gè)奇數(shù)的篩選，所以我們這么寫(xiě)：

[1, 2, 3].filter(item => item % 2 !== 0)
// > [1, 3]

然后我們改為Promise版本：

[1, 2, 3].filter(async item => item % 2 !== 0)
// > [1, 2, 3]

這會(huì)導(dǎo)致我們的篩選功能失效，因?yàn)?b>filter的返回值匹配不是完全相等的匹配，只要是返回值能轉(zhuǎn)換為true，就會(huì)被認(rèn)定為通過(guò)篩選。
Promise對(duì)象必然是true的，所以篩選失效。
所以我們的處理方式與上邊的forEach類(lèi)似，同樣需要自己進(jìn)行對(duì)象增強(qiáng)
但我們這里直接選擇一個(gè)取巧的方式：

Array.prototype.filterSync = async function (callback, thisArg) {
  let filterResult = await Promise.all(this.map(callback))
  // > [true, false, true]

  return this.filter((_, index) => filterResult[index])
}

await [1, 2, 3].filterSync(item => item % 2 !== 0)

我們可以直接在內(nèi)部調(diào)用map方法，因?yàn)槲覀冎?b>map會(huì)將所有的返回值返回為一個(gè)新的數(shù)組。
這也就意味著，我們map可以拿到我們對(duì)所有item進(jìn)行篩選的結(jié)果，true或者false。
接下來(lái)對(duì)原數(shù)組每一項(xiàng)進(jìn)行返回對(duì)應(yīng)下標(biāo)的結(jié)果即可。

some作為一個(gè)用來(lái)檢測(cè)數(shù)組是否滿(mǎn)足一些條件的函數(shù)存在，同樣是可以用作遍歷的
函數(shù)簽名同forEach，有區(qū)別的是當(dāng)任一callback返回值匹配為true則會(huì)直接返回true，如果所有的callback匹配均為false，則返回false

我們要判斷數(shù)組中是否有元素等于2：

[1, 2, 3].some(item => item === 2)
// > true

然后我們將它改為Promise

[1, 2, 3].some(async item => item === 2)
// > true

這個(gè)函數(shù)依然會(huì)返回true，但是卻不是我們想要的，因?yàn)檫@個(gè)是async返回的Promise對(duì)象被認(rèn)定為true。

所以，我們要進(jìn)行如下處理：

Array.prototype.someSync = async function (callback, thisArg) {
  for (let [index, item] of Object.entries(this)) {
    if (await callback(item, index, this)) return true
  }

  return false
}
await [1, 2, 3].someSync(async item => item === 2)
// > true

因?yàn)?b>some在匹配到第一個(gè)true之后就會(huì)終止遍歷，所以我們?cè)谶@里邊使用forEach的話(huà)是在性能上的一種浪費(fèi)。
同樣是利用了await會(huì)忽略普通表達(dá)式的優(yōu)勢(shì)，在內(nèi)部使用for-of來(lái)實(shí)現(xiàn)我們的需求

以及我們最后的一個(gè)every
函數(shù)簽名同樣與forEach一樣，
但是callback的處理還是有一些區(qū)別的：
其實(shí)換一種角度考慮，every就是一個(gè)反向的some
some會(huì)在獲取到第一個(gè)true時(shí)終止
而every會(huì)在獲取到第一個(gè)false時(shí)終止，如果所有元素均為true，則返回true

我們要判定數(shù)組中元素是否全部大于3

[1, 2, 3].every(item => item > 3)
// > false

很顯然，一個(gè)都沒(méi)有匹配到的，而且回調(diào)函數(shù)在執(zhí)行到第一次時(shí)就已經(jīng)終止了，不會(huì)繼續(xù)執(zhí)行下去。
我們改為Promise版本：

[1, 2, 3].every(async => item > 3)
// > true

這個(gè)必然是true，因?yàn)槲覀兣袛嗟氖?b>Promise對(duì)象
所以我們拿上邊的someSync實(shí)現(xiàn)稍微修改一下：

Array.prototype.everySync = async function (callback, thisArg) {
  for (let [index, item] of Object.entries(this)) {
    if (!await callback(item, index, this)) return false
  }

  return true
}
await [1, 2, 3].everySync(async item => item === 2)
// > false

當(dāng)匹配到任意一個(gè)false時(shí)，直接返回false，終止遍歷。

關(guān)于數(shù)組的這幾個(gè)遍歷方法。
因?yàn)?b>map和reduce的特性，所以是在使用async時(shí)改動(dòng)最小的函數(shù)。
reduce的結(jié)果很像一個(gè)洋蔥模型
但對(duì)于其他的遍歷函數(shù)來(lái)說(shuō)，目前來(lái)看就需要自己來(lái)實(shí)現(xiàn)了。

四個(gè)*Sync函數(shù)的實(shí)現(xiàn)：https://github.com/Jiasm/notebook/tree/master/array-sync

Array - JavaScript | MDN