<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<script>
// 凡是 异步代码和定时代码 都会等待 主程序执行完毕 再开始
// 哪些是异步操作 1 定时器延时器 2 ajax 3 绑定的onclick事件函数.. 4
// console.log(1)
// setTimeout(function () {
// console.log(2);
// },0)
// console.log(3)
// 注意 new promise 会立刻执行 而 .then 是需要异步的
// console.log(1)
// new Promise(function(resolve,reject){
// console.log('2')
// resolve()
// }).then(function(){
// console.log(3)
// })
// console.log(4)
// 宏任务 : 定时器延时器 微任务:promise
// 先同步 再取出第一个宏任务执行 所有的相关微任务总会在下一个宏任务之前全部执行完毕
// 如果遇见 就 先微后宏
// console.log(1)
// setTimeout(function () {
// console.log(2);
// },0)
// new Promise(function (resolve) {
// console.log('3');
// resolve();
// }).then(function () {
// console.log('4')
// })
console.log('1');
// 延时器 放到事件队列里面 宏任务
setTimeout(function () {
console.log('2');
new Promise(function (resolve) {
console.log('3');
resolve();
}).then(function () {
console.log('4')
})
},0)
// promise new promise立刻执行 但是 then 会放到事件队列 微任务
new Promise(function (resolve) {
console.log('5');
resolve();
}).then(function () {
console.log('6')
})
// 延时器 放到事件队列里面 宏任务
setTimeout(function () {
console.log('7');
new Promise(function (resolve) {
console.log('8');
resolve();
}).then(function () {
console.log('9')
})
console.log('10')
},0)
console.log('11')
// 1 5 11 6 2 3 4 7 8 10 9
//1 此时事件队列代码 有一个 then 6 两个 延时器setTimeout
//2 先微后宏 执行 then 6
//3 剩下 两个 延时器setTimeout 先上面 再下面
//4 上面的setTimeout 2 3 虽然里面有 then 4 但是记住一个宏任务里面必须会执行完微任务
//5 下面的setTimeout
// 1 5 11 6 2 3 4 7 8 10 9
// 第一个setTimeout宏任务结束之后,会去检查队列中是否有微任务存在,如果有的话先执行微任务。(微任务优先级高)
// setTimeout(function () {
// console.log('7');
// new Promise(function (resolve) {
// console.log('8');
// resolve();
// }).then(function () {
// console.log('9')
// })
// console.log('10')
// },0)
</script>
</body>
</html>
事件循环面试题
猜你喜欢
转载自blog.csdn.net/weixin_43837268/article/details/109142374
今日推荐
周排行