一道promise的题

该问题是本人在2021.5.28一个交流群里看到的
----------2021.6.27 在知乎里也看到了这个问题知乎链接,首赞解释得比较清楚,下面是当时的探索历程,这句话是一个月后加的


问题

        Promise.resolve().then(() => {
   
            console.log(0);
            return Promise.resolve(4);
        }).then((res) => {
   
            console.log(res)
        })

        Promise.resolve().then(() => {
   
            console.log(1);
        }).then(() => {
   
            console.log(2);
        }).then(() => {
   
            console.log(3);
        }).then(() => {
   
            console.log(5);
        }).then(() => {
   
            console.log(6);
        }).then(() => {
   
            console.log(7);
        })

答案:在这里插入图片描述
得彻底搞清楚promise的原理才行

在这里插入图片描述

探寻历程

–时间 2021.6.22重新复习promise源码,依旧没有得到如何来的答案
思路如下

    then1内部回调,因为前面是给的成功的p对象,所以会放入微队列

    then2因为then1返回的是pending的p1对象,所以会把回调放到p1的callbacks数组里,
    等待then1回调出结果后,then1内部根据结果执行resolve(v)或者reject(r),
    在resolve(v)或者reject(r)内部,会把处理callbacks操作加入微队列

    第二段开始,除了then3会得到一个成功的p对象,后面的then都只能得到一个pending的对象
    所以执行同步代码的时候,
    只有then3的回调会主动放到微队列,然后把后面的then都放到前面对应的p对象的callbacks里
    
    同步结束,只有then1和then3的回调以此进入微队列,其余均是callbacks里
    
    第一次微队列,先执行then1的回调, 输出0, 然后得到一个成功的值为4 的p_success(自己瞎命名的)对象
    then1内部得到成功的p对象,执行resolve(p_success),把放有 then2 的回调的callbacks处理函数放入新的微队列

    then2,已经没啥事了,同步异步均跟他无关

    跳到then3的回调, 执行, 输出1 , 然后得到一个成功的,值为undefined的 p对象
    then3内部,得到成功p对象,执行resolve(p),把放有 then4 的回调的callbacks处理函数放入新的微队列

到这里就卡住了,不知道为什么输出1后会继续输出2然后3,又跳到4,明明输出0后微队列里面就只有输出1,输出0后把输出4的回调放入了微队列,但是输出1后却不是执行的输出4,而是输出2,

太难了,而且,源码的教学基本上对于promise都是用setTimeout来模拟,我用queueMicrotask来模拟也没办法达到原版promise的效果,但是明确了一点

通过手写promise,知道了 new Promise()的时候,并不是异步执行的,
Promise.resolve()也不是异步执行的,所有关于Promise异步执行的只是then里的回调函数即参数
并且,then方法也不全是异步,只有里面的执行回调的部分是异步的,返回一个新Promise的代步不是异步的
但是在异步执行完毕之前,该promise的状态是pending,通过闭包等待异步执行完毕后改变状态

promise里面的代码,只有then里的回调是异步的,其他都是同步的,当异步处理的时候,有可能then没有得到结果来执行回调,就会保存回调到实例对象上,但等到闭包拿到结果后,也会是加入异步队列去处理这个回调函数,

看到一篇文章,里面说then的注册只会在上一个then返回来一个有状态的promise对象,如果再往下继续then,但是没有结果,就会去执行其他同步代码, 文章链接
在这里插入图片描述
但是我持保留意见,因为我在debug的时候,把每个then都let一个对象,可以看到每个对象其实都是生成了的,只不过都是pending状态,如下

let p1 = Promise
    .resolve()

let p2 = p1.then(() => {
   
    console.log(0
  • 2
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 3
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值