同步异步编程，微任务/宏任务

同步异步编程

同步异步编程
image.png js单线程编程异步

异步的有 ： 定时器 事件绑定 Promise/async/await Ajax异步请求数据
先执行同步，期间遇到异步会加入到任务队列，待同步执行完，异步中根据时间来判断哪个先执行，1356742

阻断先执行到达时间的

循环中插定时器

image.png

两种理解：1.设置定时器 到达时间（此时不管GUI是否完成），放入到队列（队列中存放的顺序就是最后要执行的顺序），最后GUI空闲，执行的顺序直接按照先进先出处理即可。2.设置定时器 直接放入到队列 浏览器开始监听计时 根据到达时间调整任务的优先级，后期GUI空闲下来，去任务队列中按照优先级去处理

image.png

微任务/宏任务

image.png

题目

function func1(){
    console.log('func1 start');
    return new Promise(resolve=>{
        resolve('OK');
    });
}
function func2(){
    console.log('func2 start');
    return new Promise(resolve=>{
        setTimeout(()=>{
            resolve('OK');
        },10);
    });
}

console.log(1);
setTimeout(async () => {
    console.log(2);
    await func1();
    console.log(3);
}, 20);
for (let i = 0; i < 90000000; i++) {} //循环大约要进行80MS左右
console.log(4);
func1().then(result=>{
    console.log(5);
});
func2().then(result=>{
    console.log(6);
});
setTimeout(() => {
    console.log(7);
}, 0);
console.log(8);

image.png