Promise

48 阅读3分钟

1.Promise是什么?

1.1.抽象表达
  • Promise是(ES6提出的)一门新的技术
  • Promise是JS中异步编程的新方案(旧方案是-----纯回调)
1.2.具体表达
  • 从语法上来说:Promise是一个内置构造函数
  • 从功能上来说:Promise的实例对象可以用来封装一个异步操作,并可以获取其成功失败的值
1.3.概述
  • Promise不是回调,是一个内置的构造函数,是程序员自己new调用的。
  • new Promise的时候,要传入一个构造函数,他是同步的回调,会立即在主线程上执行,它被称为executor函数
  • 每一个promise实例都有3种状态,分别为:初始化(pending)、成功(fulfilled)、失败(rejected)
  • 每一个Promise实例在被new出来的那一刻状态都是初始化(pending)
  • executor函数会接受到两个参数,他们都是函数、分别用形参:resolve、reject接收
    1. 调用resolve,

      会让Promise实例状态变为成功(fulfilled),

      同时可以指定成功的value

    2. 调用reject

      会让Promise实例状态变为失败(rejected),

      同时可以指定失败的reason

       const p = new Promise((resolve, reject) => {
         resolve('ok')
       })
       console.log('@', p) //一般不把Promise实例做控制台输出

回调函数: 我们定义的,我们没有调用,最终执行了

同步的回调函数:立即在主线程上执行了,不回放入回调队列中

    eg:数组遍历相关的回调函数/Promise的executor函数

异步的回调函数:不会立即执行,会放入回调队列中以后执行

    eg:定时器回调、ajax回调、Promise成功/失败的回调

2.重要语法

new Promise(executor)构造函数

Promise.prototype.then方法

3.基本编码流程

  1. 创建Promise的实例对象(pending状态),传入executor函数
  2. 在executor中启动异步任务(定时器、ajax请求)
  3. 根据异步任务的结果,做不同处理:
  4. 通过then方法为Promise指定成功、失败的回调函数,来获取成功的value、失败的reason

!!!then方法所指定的:成功的回调、失败的回调,都是异步的回调

4.关于状态的注意点

  1. 三个状态
  2. 两种状态改变 pending==>fulfilled pending==>rejected
  3. 状态只能改变一次

image.png

image.png

5.Promise的API

image.png

image.png

6.改变Promise实例的状态和指定回调函数谁先谁后

改变Promise实例的状态和指定回调函数谁先谁后 1.都有可能,正常情况下是先指定回调,再改变状态;但也可以先指定状态,再修改回调 2.如何先改状态在指定回调? 延迟一会再调用then() image.png 3.Promise实例什么时候才能得到数据? 如果先指定的回调,那当状态发生改变时,回调函数就会调用,得到数据 如果先改变的状态,那当指定回调时,回调函数就会调用,得到数据

image.png

7.中断Promise链

  1. 当使用promise的then链式调用时,在中间中断,不再调用后面的回调函数。
  2. 解决方法:在失败的回调函数中返回一个pending状态的promise实例。

image.png

8.错误穿透

  1. 当使用promise的then链式调用时,可以在最后用catch制定一个失败的回调。
  2. 前面任何操作出现了错误,都会穿到最后失败的回调中处理了

备注:如果不存在then的链式调用,就不需要考虑then的错误穿透。

image.png

image.png