-
Notifications
You must be signed in to change notification settings - Fork 0
/
eventLoop.html
66 lines (63 loc) · 1.87 KB
/
eventLoop.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
<!--
* @Author: your name
* @Date: 2020-07-09 16:18:02
* @LastEditTime: 2020-07-14 16:46:53
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: \jsQuestion\eventLoop.html
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body></body>
</html>
<script>
Promise.resolve().then(() => {
console.log("Promise1");
setTimeout(() => {
console.log("setTimeout2");
}, 0);
});
setTimeout(() => {
console.log("setTimeout1");
Promise.resolve().then(() => {
console.log("Promise2");
});
}, 0);
console.log("start");
/*
1.promise1 压入微任务队列
2.settimeout1 压入宏任务延时队列
3.执行 宏任务 普通队列 start
4.执行微任务队列 promise1
5.执行 宏任务 普通队列 promise1
6.把settimeout2 压入宏任务 延时队列
7. 执行延时队列中的 settimeout1
8. 执行 settimeout1中的 同步任务 settimeout1
9.把promise2 压入微任务队列 settimeout 出队列 检查 微任务 执行 微任务队列中的 promise2
10. 执行延时队列中的 settimeout2
*/
/*
1.整个脚本作为第一个宏任务执行
2.先执行同步代码 打印 start
3.promise 放入微任务队列
4.setTimeout 放入宏任务 延时队列
5.执行完同步任务后 执行微任务 promise 此时会打印 Promise1 再把setTimeout放入 宏任务
6. 执行延时队列中 的 setTimeout 执行 同步代码 打印 setTimeout1 把 Promise 放入 微任务 打印 Promise2
7.执行 setTimeout 打印 setTimeout2
start
Promise1
setTimeout1
Promise2
setTimeout2
*/
// console.log("start");
// Promise.resolve().then(() => {
// console.log("Promise2");
// });
// console.log('end');
</script>