锦州网站建设多少钱,东营网站开发公司,wordpress4.3 ping服务,青岛网站建设代理加盟js事件循环的理解#xff1a;
js事件循环是一种异步执行的机制#xff0c;因为js是单线程运行的#xff0c;运行在浏览器和node.js中的#xff0c;因为浏览器和node.js为它异步API提供了多线程支持#xff0c;执行是由上到下执行先执行同步#xff0c;在中间出现宏任务和…js事件循环的理解
js事件循环是一种异步执行的机制因为js是单线程运行的运行在浏览器和node.js中的因为浏览器和node.js为它异步API提供了多线程支持执行是由上到下执行先执行同步在中间出现宏任务和微任务时将宏任务和微任务先放入任务队列等待处理将同步执行完毕从任务队列中先将微任务执行然后执行宏任务
js执行是从宏任务开始先拿一个宏任务执行清除一个任务队列在拿一个宏任务在清除一个任务队列
事件循环就是不断的判断主线程是否为空如果为空就将任务队列中的事件放到主线程中执行这个过程会不断循环直到执行完毕 js的事件循环执行
js事件循环是从上到下依次执行的在执行中先执行一个宏任务因为执行时会出现异步执行又因为异步是属于微任务所以当js执行时碰到异步时会将它先存放在微任务的队列中因为可能出现定时器延时器他们属于一个宏任务将它放在宏任务队列中继续向下执行同步当所有同步执行完毕在执行一个队列的微任务清除整个任务队列在执行宏任务队列清除宏任务队列因为微任务的优先级大于宏任务的优先级所以先执行微任务然后在执行一个宏任务在清除一个任务队列直到整个代码执行完毕 js事件循环分为同步执行和异步执行代码
1如何理解同步
同步sync是按照代码顺序执行从上向下执行立即执行,会阻塞代码执行
例
同步操作会阻塞代码的继续执行直到操作完成
script //同步 从上到下执行会阻塞代码执行上一段代码执行完毕后执行下段 console.log(开始); console.log(中间); console.log(结束); // 执行顺序 开始 中间 结束 /script 2如何理解异步
异步async是先执行同步代码在执行异步代码同步代码中出现异步代码会跳过执行
promise.then才会被放在微任务中
script // 异步 从上到下执行不会阻塞代码执行像将同步代码执行中间如果出现异步代码 // 先跳过异步代码将所有同步代码执行完毕在执行异步代码此间异步代码先存储到任务队列中 console.log(开始); setTimeout(function(){ console.log(异步操作); },0) console.log(结束); // 执行顺序 开始 结束 异步操作 /script 03主线程与异步线程
js是单线程我们又称该线程为js主线程主线程处理同步代码
单线程同时间只能做一件事情同步多线程同时间可以做多件事情异步
为什么js单线程可以做多件事情或可以异步
因为js是运行在浏览器和node.js中的使用为它异步API提供了多线程支持
script console.log(开始); setTimeout(function(){ console.log(异步操作); },0) console.log(结束); // 执行顺序 开始 结束 异步操作 /script 04宏任务微任务
在js中异步代码又分为宏任务和微任务
宏任务包括setTimeout,setInterval事件处理函数
微任务包括Promise.then回调Promise.catch回调
宏任务是代码运行环境提供的微任务是语言提供的微任务的优先级大于宏任务
script
console.log(开始); setTimeout(function(){ console.log(宏任务); },0) Promise.resolve().then((){ console.log(微任务);
}) console.log(结束);
//执行顺序 开始 结束 微任务 宏任务
/script 05任务队列
视频演示https://img-blog.csdnimg.cn/cc12512809dd413d8c0ba32d31fe7738.gif#pic_center
任务队列是用于存储待处理回调函数的队列
回调函数包括用户交互的事件点击滚动处理函数忘了亲亲回调定时器等
执行是先执行同步在中间出现宏任务和微任务时将宏任务和微任务先放入任务队列等待处理将使用同步执行完毕从任务队列中先将微任务执行然后执行宏任务 06理解事件循环
事件循环就是不断的判断主线程是否为空如果为空就将任务队列中的事件放到主线程中执行这个过程会不断循环直到执行完毕
script console.log(Script 1 开始);
Promise.resolve().then(function() { console.log(Script 1 Promise); }); console.log(Script 1 结束); /script script console.log(Script 2 开始);
Promise.resolve().then(function() { console.log(Script 2 Promise); }); console.log(Script 2 结束);
//执行顺序 Script 1 开始 Script 1 结束 Script 1 Promise Script 2 开始 Script 2 结束 Script 2 Promise /script
