首先了解,js是单线程操作。
WHY?
假如js是多线程的,当我们在某个页面浏览某个美女图片时,突然图片不见了,是不是感觉一脸疑问。js单线程就是解决了这个问题,防止同时操作同一个DOM元素。
js中的异步操作
setTTimeout , setInterval , ajax , promise.then等;
同步任务与异步任务
同步任务:在主线程等待执行的任务,当前任务执行完,下个任务才可以继续执行。
异步任务:首先异步任务不在主线程中,而是在任务队列中,通知主线程可以执行了,主线程才会执行当前异步任务。
微任务与宏任务
微任务:promise.then
宏任务:整体代码块,setTTimeout , setInterval ,
注意:new Promise输入同步任务,会在主线程中立即执行。promise 微任务 是在本轮“事件循环”(event loop)的结束时,而不是在下一轮“事件循环”的开始时。
在执行代码时,会根据同步任务还是异步任务,会把任务分配到主线程还是任务队列中,在任务队列中,又会分为微任务和宏任务。当主线程任务执行完成后,会执行任务队列中的微任务,执行完成后本次事件循环完成。执行下一次宏任务,以此循环上述,形成event loop;
列子:
console.log(11111);
setTimeout(function(){
console.log(22222);
},0)
Promise.resolve().then(function(){
console.log(33333);
})
Promise.resolve().then(function(){
console.log(44444);
})
console.log(55555);
会依次打印: 11111 , 55555, 33333,44444 ,22222