美文网首页
Promise讲解

Promise讲解

作者: 扶得一人醉如苏沐晨 | 来源:发表于2022-01-20 09:00 被阅读0次

    一、定义

    Promise 是异步编程的一种解决方案,其实是一个构造函数,自己身上有all、reject、resolve这几个方法,原型上(new出来的promise对象)有then、catch等方法。说明用new Promise构造出来的对象有.then()和.catch()方法

    用console.dir(Promise)打印一下看看


    console.log() 方法

    用于在 console 窗口中输入信息。在调试时,可以替代 alert() 或 document.write() 输入需要输出的内容

    console.dir() 方法

    用来对一个对象进行检查(inspect),并以易于阅读和打印的格式显示。该方法对于输入 DOM 对象非常有用,因为 dir 方法会显示DOM对象的所有属性

    二.特点

    (1)对象的状态不受外界影响。

    Promise对象代表一个异步操作,有三种状态:

    pending(初始化状态)

    fulfilled(成功状态)

    rejected(失败状态)

    (2)pending 状态的 Promise 对象可能会变为fulfilled 状态并传递一个值给相应的状态处理方法,也可能变为失败状态(rejected)并传递失败信息。当其中任一种情况出现时,Promise 对象的 then 方法绑定的处理方法(handlers )就会被调用(then方法包含两个参数:onfulfilled 和 onrejected,它们都是 Function 类型。当Promise状态为fulfilled时,调用 then 的 onfulfilled 方法,当Promise状态为rejected时,调用 then 的 onrejected 方法

     当然Promise也可以通过.catch进行捕获,因为 Promise.prototype.then 和 Promise.prototype.catch 方法返回promise 对象, 所以它们可以被链式调用。

    代码并不对,只为了方便解释

    二.深入理解

    1.Promise 是用来管理异步编程的,它本身不是异步的,new Promise的时候会立即把executor函数执行,只不过我们一般会在executor函数中处理一个异步操作。

    2.Promise 采用了回调函数延迟绑定技术,在执行 resolve 函数的时候,回调函数还没有绑定,那么只能推迟回调函数的执行。


    new Promise的时候先执行executor函数,打印出 1、2,Promise在执行resolve时,触发微任务,还是继续往下执行同步任务,然后打印出3,此时同步任务执行完成,最后执行刚刚那个微任务,从而执行.then中成功的方法。

    3.错误处理,多个Promise链式操作的错误捕获可以通过一个catch处理;例如下面一段代码

    这段代码有四个 Promise 对象,无论哪个对象里面抛出异常,都可以通过最后一个.catch 来捕获异常,通过这种方式可以将所有 Promise 对象的错误合并到一个函数来处理,这样就解决了每个任务都需要单独处理异常的问题。

    4.常用方法

    Promise.resolve() Promise.resolve(value)方法返回一个以给定值解析后的Promise 对象。 Promise.resolve()等价于下面的写法:

    Promise.resolve方法的参数分成四种情况。

    1)参数不是具有then方法的对象,或根本就不是对象


    2)不带有任何参数 Promise.resolve()方法允许调用时不带参数,直接返回一个resolved状态的 Promise 对象。如果希望得到一个 Promise 对象,比较方便的方法就是直接调用Promise.resolve()方法。


    3)参数是一个 Promise 实例

    p1是一个 Promise,3 秒之后变为rejected。p2的状态在 1 秒之后改变,resolve方法返回的是p1。由于p2返回的是另一个 Promise,导致p2自己的状态无效了,由p1的状态决定p2的状态。所以,后面的then语句都变成针对后者(p1)。又过了 2 秒,p1变为rejected,导致触发catch方法指定的回调函数。


    4)参数是一个thenable对象 thenable对象指的是具有then方法的对象,Promise.resolve方法会将这个对象转为 Promise 对象,然后就立即执行thenable对象的then方法。

    Promise.reject() Promise.reject()方法返回一个带有拒绝原因的Promise对象。

    值得注意的是,调用resolve或reject以后,Promise 的使命就完成了,后继操作应该放到then方法里面,而不应该直接写在resolve或reject的后面。所以,最好在它们前面加上return语句,这样就不会有意外。

    Promise.all()



    Promise.all 生成并返回一个新的 Promise 对象,所以它可以使用 Promise 实例的所有方法。参数传递promise数组中所有的 Promise 对象都变为resolve的时候,该方法才会返回一个数组, 新创建的 Promise 则会使用这些 promise 的值。 如果参数中的任何一个promise为reject的话,则整个Promise.all调用会立即终止,并返回一个reject的新的 Promise 对象。


    Promise.race()

    Promise.all()方法的效果是"谁跑的慢,以谁为准执行回调",那么相对的就有另一个方法"谁跑的快,以谁为准执行回调",这就是Promise.race()方法,这个词本来就是赛跑的意思。race的用法与all一样,接收一个promise对象数组为参数。

    上面的代码创建了3个promise对象,这些promise对象会分别在1ms、32ms 和 64ms后变为确定状态,即FulFilled,并且在第一个变为确定状态的1ms后,.then注册的回调函数就会被调用。

    实际操作
    假设有这样一个需求:红灯 3s 亮一次,绿灯 1s 亮一次,黄灯 2s 亮一次;如何让三个灯不断交替重复亮灯? 三个亮灯函数已经存在:

    同样也可以通过async/await 的实现:

    相关文章

      网友评论

          本文标题:Promise讲解

          本文链接:https://www.haomeiwen.com/subject/somrhrtx.html