Promise介绍以及使用

176 阅读3分钟

一起养成写作习惯!这是我参与「掘金日新计划 · 4 月更文挑战」的第21天,点击查看活动详情

简介:

promise其实是一个对象,一个构造函数。使用的时候new Promise

  • 主要是为了解决异步,可以让异步操作写起来就像写同步操作的流程,不必一层一层嵌套回调函数
  • promise构造函数接受一个回调函数f作为参数,f里面是异步操作的代码,然后返回值是一个promise实例。
  • 设计思想:所有异步任务都返回一个promise实例,promise实例有一个then方法,指定下一步的回调函数。
  • 传统代码回调函数嵌套回调函数变得横向发展而不是向下发展。

promise对象的状态:

  • promise通过自身的状态来控制异步操作
    • 异步操作进行中:pending
    • 异步操作已成功:fullfilled
    • 异步操作失败:rejected
  • 当状态从pending到fulfill或从pending到rejected状态一旦发生变化,就凝固了,称为resolve(已定型)
  • promise实例的状态变化只可能发生一次,所以promise的最终结果只有俩种:
    • 异步操作成功,promise实例传回一个值(value),状态变为fulfilled
    • 异步操作失败,promise实例抛出一个错误(error),状态变为rejected

promise构造函数的参数:

  • 两个参数,分别是resolve和reject,他们是两个函数,由js引擎提供。
    • resolve函数的作用:将promise实例的状态从未完成变为成功,异步操作成功时调用并将异步操作的结果作为参数传递出去。(then接收)
    • rejected函数的作用:将promise实例的状态从未完成变为失败,在异步操作失败时调用,将异步操作抛出的错误作为参数传递出去。

Promise.prototype.then方法:

  • 可以接受两个回调函数作为参数,第一个是异步操作成功时候的回调函数,第二个是异步操作失败时的回调函数,一旦状态改变就调用相应的回调函数。
  • then方法可以链式调用,只要前一步状态变为fulfilled,就会依次执行紧跟在后面的回调函数。
  • 如果第一个回调函数状态变为rejected,那么第二个和第三个都不会执行了,promise开始寻找,接下来第一个为rejected的回掉函数,所以 promise对象的报错具有传递性。

then方法传递的参数是上一个then或者promise里面函数的返回值。

Promise.prototype.catch方法:

错误发生时的回调函数,相当于.then(null,reject)的一个别名,它捕获reject以及then回调运行时的错误

new Promise(function(resolve,reject){
    throw new Error("自定义错误");
})
.catch(function(error){ 
    console.log(error); 
})

Promise.prototype.finally方法:

不论成功或失败,这个方法无论状态都会执行,他不接受任何参数,与状态无关,不依赖Promise执行结果

Promise.all:

  • 把所有的Promise放在一起,然后当所有的Promise全部resolved,这个Promise.all才会真正的resolved。也就是所有的成功了它才成功,可以理解成一个包装器,它包装多个Promise为一个新的Promise,那么Promise.all实际上接收的是一个数组,fulfilled条件是所有包装的Promise全部fulfilled。
  • 使用这个,需要给每一个Promise加一个catch,整个promise.all才会得到一个resolved结果。
Promise.all([promise1,promise2]])
.then(result => console.log(result))
.catch(e => console.log(e));

Promise.race(谁先返回就执行谁)

包含多个Promise为一个新的Promise,返回第一个fulfilled。

Promise.race([promise1,promise2])
.then()
.catch();