Java Script 的回调和微任务队列

问题描述 投票:0回答:1
p1 = new Promise((res,rej)=>{
    console.log("p1 setTimeout");
    setTimeout(()=>{
      res(17);
    }, 10000);
});

p2 = new Promise((res,rej)=>{
    console.log("p2 setTimeout");
    setTimeout(()=>{
      res(36);
    }, 2000);
});

function checkIt() {
    console.log("Started");

    let val1 = this.p1;
    console.log("P1");
    val1.then((data)=>{console.log("P1 => "+data)});

    let val2 = this.p2;
    console.log("P2");
    val2.then((data)=>{console.log("P2 => "+data)});

    console.log("End");
}

checkIt();

我对上面写的JavaScript代码的理解是:

1:在回调队列中,先p2的setTimeout,然后p1的setTimeout(并且它们将以先进先出的方式执行)

2:回调队列不会在微任务队列之前执行

3:在微任务队列中,p1的回调函数会先执行,然后是p2的回调函数(并且会以先进先出的方式执行)

4:因此这应该是僵局。

但是得到输出:

1:p1设置超时

2:p2设置超时

3:开始

4:P1

5:P2

6:结束

7:(2秒后)P2 => 36

8:(10秒后)P1 => 17

疑惑:第7行和第8行输出是怎么来的?

我已经运行了代码并获得了上面定义的输出

javascript asynchronous event-loop asynccallback
1个回答
0
投票

setTimeout
在超时后创建一个新的宏任务排队到事件循环中,因此您的承诺在不同的宏任务中排队并且完全没有关系。

© www.soinside.com 2019 - 2024. All rights reserved.