异步编程(Asynchronous) - 9 Promise.all / Promise.race

Promise.all

• Promise.all 会把多个Promise合并成一个Promise请求,统一管理
• 这个方法会返回一个全新的Promise对象

const promise = Promise.all([
  ajax('/api/users.json'), // 一个一个的异步任务
  ajax('/api/posts.json'), // 一个一个的异步任务
  ajax('/api/posts1.json') // 一个一个的异步任务
])
// 这个对象返回的结果是一个数组,每个元素对应每个任务的返回值
promise.then(function (values) {
  console.info('values', values)
}).catch(function (error) { // 只有当所有的Promise任务都成功了，如果有其中一个任务失败了，那么这个Pormise就会以失败返回
  console.info('error', error)
})

Promise.all 的场景

// 组合使用,串行合并行Promise请求
// urls: 多个请求的url集合
ajax('/api/urls.json')
  .then(values => {
    const urls = Object.values(values) // 值
    console.info('urls', urls)
    const tasks = urls.map(url => ajax(url))
    console.info('tasks', tasks)
    return Promise.all(tasks)
  })
  .then(values => {
    console.info('values', values)
  })

Promise.race

• Promise.race 只会等第一个结束的任务,第一个结束任务的结果会作为全新Promise的对象的返回结果

const first = ajax('/api/posts.json')
const second = new Promise((resolve, reject) => {
  setTimeout(() => {
    reject(new Error('Timeout, Nuclear Bomb'))
  }, 500); // 如果设置成1,则会走到catch方法
})
Promise.race([first, second])
  .then(value => {
    console.info('first is faster then second')
    console.info('value', value)
  }).catch(error => {
    console.info('first is slower then second')
    console.info('error', error)
  })