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
});
posted @ 2018-05-11 10:49  RunningAndRunning  阅读(14083)  评论(0编辑  收藏  举报