Promise函数执行顺序

首先执行同步代码, promise() 构造函数中的代码是同步代码, .then和.catch里的是异步代码.
执行顺序:
已申明的函数–>new Promise–>setTimeout;在Promise函数中后执行.then()函数;

    testFunction() {
      console.log(`console 1`);
      setTimeout(() => {
          new Promise(() => {
              console.log(`console 10`);
          }).then(console.log(`console 11`));
      },0);
      new Promise((resolve, reject) => {
          console.log(`console 2`);
          resolve(console.log(`console 3`));
          reject(console.log(`console 4`))
      }).then(() => {
          setTimeout(() => {
              console.log(`console 7`);
              new Promise(() => {
                  console.log(`console 8`)
              }).then(console.log(`console 9`))
          },0)
      }).catch(() => {
          console.log(`consolve 5`)
      });
      console.log(`console 6`)
    }//-->console 1;console 2;console 3;console 4;console 6;console 10;console 11;console 7;console 8;console 9

例题

setImmediate(function(){

console.log(1);

},0);

setTimeout(function(){

console.log(2);

},0);

new Promisefunction(resolve){

console.log(3);

resolve();

console.log(4);

}.then(function(){

console.log(5);

});

console.log(6);

process.nextTick(function(){

console.log(7);

});

console.log(8);

输出结果: 3 4 6 8 7 5 2 1

  • macro-task: script (整体代码),setTimeout, setInterval, setImmediate, I/O, UI rendering.
  • micro-task: process.nextTick, Promise(原生),Object.observe,MutationObserver

第一步: script整体代码被执行,执行过程为

创建setImmediate macro-task
创建setTimeout macro-task
创建micro-task Promise.then 的回调,并执行script console.log(3); resolve(); console.log(4); 此时输出3和4,虽然resolve调用了,执行了但是整体代码还没执行完,无法进入Promise.then 流程。
console.log(6)输出6
process.nextTick 创建micro-task
console.log(8) 输出8

第一个过程过后,已经输出了3 4 6 8

第二步: 由于其他micro-task 的 优先级高于macro-task。

此时micro-task 中有两个任务按照优先级process.nextTick 高于 Promise,所以先输出7,再输出5

第三步: micro-task 任务列表已经执行完毕,家下来执行macro-task. 由于setTimeout的优先级高于setIImmediate,所以先输出2,再输出1。

参考: https://www.php.cn/js-tutorial-413156.html

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Charonmomo

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值