promise實現多個請求並行串行執行

早上查資料，偶然發現這個話題，發現自己並不會，於是乎，下來研究了一下。

想想之前我們用jquery寫請求的時候，要實現請求的串行執行，我們可能是這么做的。

$.ajax({
    url: '',
    data: '',
    success: function (data) {
       $.ajax({
            url: '',
            data: '',
            success: function (data) {
                $.ajax({
                    // 如此一層嵌套一層
                })
            }
        }) 
    }
})

回掉嵌套的這么深，看起來很痛苦啊，於是乎我們的promise出現啦，完美的解決我們的回掉地獄~

使用promise實現串行很簡單，調用promise.all()方法就好

那如何比較優雅的實現幾個操作的串行吶？

在promise中返回一個promise對象就是一個串行。
下面我們來簡單實現一個。

下面

/**
 * 創建promise
 * @param {Number} value 
 */
function makePromise (value) {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve(value);
    }, Math.random() * 1000)
  })
}
/**
 * 打印結果
 * @param {Number} value 
 */
function print (value) {
  return value
}

let promises = [1, 3, 4, 5, 6].map((item, index) => {
  return makePromise(item)
});

// 並行執行
Promise.all(promises)
.then(() => {
  console.log('done')
})
.catch(() => {
  console.log('error')
})

// 串行執行
let parallelPromises = promises.reduce(
  (total, currentValue) => total.then(() => currentValue.then(print)),Promise.resolve()
)

parallelPromises
.then(() => {
  // console.log('done')
})
.catch(() => {
  console.log('done')
})

// 順帶復習一下reduce方法

reduce((total, currentValue, currentIndex, arr) => {}, initialValue)
let arr1 = [1, 2, 3, 4, 5]
let res = arr1.reduce((total, currentValue, currentIndex, arr) => {
    return total + currentValue
});