Promise使用简介

2018-04-06

什么是Promise

在js中，很多操作都是异步进行的，例如事件的响应，数据请求等。
通常我们都是以回调函数的方式来写一个异步的方法，例如

fs.readdir(source, function (err, files) {
  if (err) {
  } else {
  }
})

我们需要在回调函数中去做一些操作，甚至在操作中还有异步方法，又会多一层回调函数，这样层层嵌套代码就变得十分难读。
Promise就是解决了回调函数带来的嵌套问题。
Promise是一个代理对象，和原先要进行的操作并无关系，
它通过引入一个回调，避免更多回调。

new Promise(
  // 执行器
  function (resolve, reject) {
    // 异步操作

    resolve() // 数据处理完成
    reject() // 数据处理出错
  }
)
  .then(function A() {
    // resolve 后
  }, function B() {
    // reject 后
  })

上面就返回了一个Promise对象，一个Promise对象有3个状态

pending 待定初始状态
调用resolve fulfiled 实现操作成功
调用reject rejected 被否决操作失败

状态改变就会触发then里的响应函数 then之后还可以继续调用then 根据前一个then的返回值

简单使用

console.log('start')
new Promise(resolve => {
  // 异步方法
  setTimeout(() => {
    resolve('hello')
  }, 2000)
}).then(value => {
  console.log(value + ' world')
})

// 输出 start  hello world

这就是Promise的使用方法，传入一个执行器，通常是个有异步的方法，再一定时间后resolve或reject数据，通过then或者catch拿到异步返回的数据或异常。

then的返回值

console.log('start')
new Promise(resolve => {
  setTimeout(() => {
    resolve('hello')
  }, 2000);
})
.then(value => {
  console.log(value)  // hello
  // 在then中又返回一个Promise，也会等待这个异步方法完成后执行下一个then
  return new Promise(resolve => {
    setTimeout(() => {
      resolve('world')
    }, 2000);
  })
  // 如果此处还有then函数，同样执行完后才继续向下走，可以把此处的then放在外层执行
})
.then(value => {
  // value = world
  console.log(value + 'www')
  // 没有返回值，返回空的Promise
}).then(value=> {
  // 此处value就是undefined
  console.log(value + 'hao')
  // 可以直接返回一个原始值，会被默认包装成一个Promise，可以继续调用then方法拿到
  return 1
}).then(value => {
  console.log(value) // 1
})

then方法总是返回一个Promise对象，所以可以链式调用then方法

then的参数

在上面的代码中，在then方法中传入了一个函数，用于处理fulfilled状态Promise的返回。
其实then还可以接收第二个参数，也是一个函数，用于处理rejected状态
then根据前面的Promise状态选择状态响应函数的执行

在响应函数中，可以返回新的Promise，下一级的then会在新的Promise状态改变后执行；返回其他值，则立刻执行下一级then

错误处理

错误捕获的方式有两种，一是then方法的第二个参数，二是使用catch方法捕获错误

推荐使用catch，更清晰好读
catch也可以返回promise实例，可以继续调用then
如果在catch中输出错误，可以被后面的catch捕获
建议在所有队列后都加上catch，保证错误能被处理到

静态方法

Promise.resolve

Promise.resolve(xxx)：参数为空或者非Promise对象时返回一个状态是fulfilled的Promise对象；如果传入Promise对象，直接返回不做任何处理。

Promise.reject

同上，返回rejected状态的Promise

Promise.all

Promise.all([])：传入promise对象数组，将多个promise实例包装成一个新的Promise实例

当所有Promise都完成，该Promise完成，返回全部值的数组
有任何一个失败，该Promise失败，返回值是第一个失败的子promise

Promise.race

Promise.race([]):返回第一个执行完的结果

应用：把异步操作和定时器放在一起，如果定时器先触发，认为超时