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 相关文章推荐
如何设置一定时间内只能发送一次请求
Feb 28 Javascript
window.open()实现post传递参数
Mar 12 Javascript
AngularJS bootstrap启动详解及实例代码
Sep 14 Javascript
微信小程序 石头剪刀布实例代码
Jan 04 Javascript
微信小程序 Button 组件详解及简单实例
Jan 10 Javascript
jQuery插件zTree实现单独选中根节点中第一个节点示例
Mar 08 Javascript
深入学习 JavaScript中的函数调用
Mar 23 Javascript
bootstrap modal+gridview实现弹出框效果
Aug 15 Javascript
6行代码实现微信小程序页面返回顶部效果
Dec 28 Javascript
产制造追溯系统之通过微信小程序实现移动端报表平台
Jun 03 Javascript
vue改变循环遍历后的数据实例
Nov 07 Javascript
vue+element-ui表格封装tag标签使用插槽
Jun 18 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
php数组函数序列之array_key_exists() - 查找数组键名是否存在
2011/10/29 PHP
PHP+iFrame实现页面无需刷新的异步文件上传
2014/09/16 PHP
PHP 错误处理机制
2015/07/06 PHP
PHP7匿名类用法分析
2016/09/26 PHP
thinkPHP框架乐观锁和悲观锁实例分析
2019/10/30 PHP
php让json_encode不自动转义斜杠“/”的方法
2020/04/27 PHP
弹出广告特效(一个IP只弹出一次)的代码
2007/07/27 Javascript
一个可绑定数据源的jQuery数据表格插件
2010/07/17 Javascript
javascript中"/"运算符常见错误
2010/10/13 Javascript
jquery获取节点名称
2015/04/26 Javascript
Jquery attr()方法 属性赋值和属性获取详解
2016/04/15 Javascript
JS简单设置下拉选择框默认值的方法
2016/08/20 Javascript
JQuery控制DIV的选取实现方法
2016/09/18 Javascript
js仿QQ邮箱收件人选择与搜索功能
2017/02/10 Javascript
ZeroClipboard.js使用一个flash复制多个文本框
2017/06/19 Javascript
Webpack框架核心概念(知识点整理)
2017/12/22 Javascript
webpack实用小功能介绍
2018/01/02 Javascript
vue使用ajax获取后台数据进行显示的示例
2018/08/09 Javascript
Vue+webpack+Element 兼容问题总结(小结)
2018/08/16 Javascript
JavaScript实用代码小技巧
2018/08/23 Javascript
Vue源码分析之Vue实例初始化详解
2019/08/25 Javascript
5种Python单例模式的实现方式
2016/01/14 Python
Python数据结构与算法之列表(链表,linked list)简单实现
2017/10/30 Python
python 剪切移动文件的实现代码
2018/08/02 Python
Python微医挂号网医生数据抓取
2019/01/24 Python
Django中信号signals的简单使用方法
2019/07/04 Python
HTML5 Web缓存和运用程序缓存(cookie,session)
2018/01/11 HTML / CSS
泰海淘:泰国king Power王权免税集团旗下跨境海淘综合型电商
2020/07/26 全球购物
后勤工作职责
2013/12/22 职场文书
《中彩那天》教学反思
2014/02/22 职场文书
技校毕业生自荐信
2014/06/03 职场文书
应聘会计求职信
2014/06/11 职场文书
禁毒宣传活动总结
2014/08/26 职场文书
上课迟到检讨书300字
2014/10/15 职场文书
2015年暑期见闻
2015/07/14 职场文书
解决go在函数退出后子协程的退出问题
2021/04/30 Golang