js单线程的本质 Event Loop解析


Posted in Javascript onOctober 29, 2019

怎么判断是浏览器还是node环境?

node中window是未定义;setImmediate是定义的,在浏览器中未定义

timer阶段:这个阶段会执行setTimeout和setInterval

check阶段:执行setImmediate

macro task [task] 宏任务 :script(页面代码)、setTimeout、setInterval、I/O事件、UI交互事件(点击事件)

micro task [job]  微任务: Promise、process.nextTick、Promise().then()

宏任务可以有多个队列

微任务只有一个队列

setTimeout任务之间,推迟执行的毫秒数越小,排在队列里面越靠前

在node里面,timers(setTimeout、setInterval)会优先于setImmediate

setTimeout(() => {
  console.log('setTimeout')
},0);  // 大于1000时,会先执行setImmediate
setImmediate(()=> { console.log('setImmediate')})
console.log('start');
setTimeout(function (){
  console.log('timeout');
},10);
new Promise((resolve) => {
  console.log('promise');
  resolve()
  setTimeout(() => {
    console.log('Promsie中的setTimeout');
  },0);
}).then(() => {
  console.log('then');
});
console.log('end');

运行机制

1. 在执行栈中执行一个宏任务。

2. 执行过程中遇到微任务,将微任务添加到微任务队列中。

3. 当前宏任务执行完毕,立即执行微任务队列中的任务。

4. 当前微任务队列中的任务执行完毕,检查渲染,GUI线程接管渲染。

5. 渲染完毕后,js线程接管,开启下一次事件循环,执行下一次宏任务(事件队列中取)。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js 与或运算符 || && 妙用
Dec 09 Javascript
javascript分页代码实例分享(js分页)
Dec 13 Javascript
javascript 按键事件(兼容各浏览器)
Dec 20 Javascript
jquery解析XML字符串和XML文件的方法说明
Feb 21 Javascript
js游戏人物上下左右跑步效果代码分享
Aug 28 Javascript
基于jQuery1.9版本如何判断浏览器版本类型
Jan 12 Javascript
jQuery实现漂亮实用的商品图片tips提示框效果(无图片箭头+阴影)
Apr 16 Javascript
javascript滚轮事件基础实例讲解(37)
Feb 14 Javascript
zTree jQuery 树插件的使用(实例讲解)
Sep 25 jQuery
原生javascript AJAX 三级联动的实现代码
May 04 Javascript
react项目实践之webpack-dev-serve
Sep 14 Javascript
原生JS实现列表内容自动向上滚动效果
May 22 Javascript
解决axios post 后端无法接收数据的问题
Oct 29 #Javascript
使用axios请求接口,几种content-type的区别详解
Oct 29 #Javascript
vue+elementui 对话框取消 表单验证重置示例
Oct 29 #Javascript
vue实现路由监听和参数监听
Oct 29 #Javascript
基于axios 的responseType类型的设置方法
Oct 29 #Javascript
关于vue2强制刷新,解决页面不会重新渲染的问题
Oct 29 #Javascript
vue + elementUI实现省市县三级联动的方法示例
Oct 29 #Javascript
You might like
谏山创故乡大分县日田市水坝将设立《进击的巨人》立艾伦、三笠以及阿尔敏的铜像!
2020/03/06 日漫
linux下为php添加curl扩展的方法
2011/07/29 PHP
使用PHP实现阻止用户上传成人照片或者裸照
2014/12/25 PHP
ThinkPHP开发框架函数详解:C方法
2015/08/14 PHP
php生成网页桌面快捷方式
2017/05/05 PHP
PHP实现微信红包金额拆分试玩的算法示例
2018/04/07 PHP
用 javascript 实现的点击复制代码
2007/03/24 Javascript
Firebug入门指南(Firefox浏览器)
2010/08/21 Javascript
Extjs4 关于Store的一些操作(加载/回调/添加)
2013/04/18 Javascript
js实现全屏漂浮广告移入光标停止移动
2013/12/02 Javascript
购物车选中得到价格实现示例
2014/01/26 Javascript
jQuery判断checkbox是否选中的3种方法
2014/08/12 Javascript
jquery预加载图片的方法
2015/05/27 Javascript
jquery.serialize() 函数语法及简单实例
2016/07/08 Javascript
jQuery leonaScroll 1.1 自定义滚动条插件(推荐)
2016/09/17 Javascript
Bootstrap组合上、下拉框简单实现代码
2017/03/06 Javascript
jquery如何实现点击空白处隐藏元素
2017/12/05 jQuery
微信小程序上线发布流程图文详解
2019/05/06 Javascript
Angular+ionic实现折叠展开效果的示例代码
2020/07/29 Javascript
python正则表达式re模块详解
2014/06/25 Python
python使用wxPython打开并播放wav文件的方法
2015/04/24 Python
对python中执行DOS命令的3种方法总结
2018/05/12 Python
Python实现堡垒机模式下远程命令执行操作示例
2019/05/09 Python
python实现五子棋游戏
2019/06/18 Python
python调用动态链接库的基本过程详解
2019/06/19 Python
Flask配置Cors跨域的实现
2019/07/12 Python
python实现拼图小游戏
2020/02/22 Python
python数据库编程 Mysql实现通讯录
2020/03/27 Python
pycharm 实现调试窗口恢复
2021/02/05 Python
CSS3 icon font完全指南(CSS3 font 会取代icon图标)
2013/01/06 HTML / CSS
Probikekit日本:自行车套件,跑步和铁人三项装备
2017/04/03 全球购物
美国女性卫生用品公司:Thinx
2017/06/30 全球购物
印度购物网站:TATA CLiQ
2017/11/23 全球购物
《富饶的西沙群岛》教学反思
2014/04/09 职场文书
投标文件签署授权委托书范本
2014/10/12 职场文书
教师师德工作总结2015
2015/07/22 职场文书