Js之事件循环(执行机制)
js的执行机制是事件循环
什么是事件循环?
js引擎在执行代码时,首先会将同步代码加入到主线程中,异步代码会放到event table中注册回调函数,
当主线程空闲之后,event table中的回调函数就会被加入到主线程中执行。
当遇到宏任务(例如:script、setTimeout、setInterval等)又有微任务(promise、promise.nextTick)时,首先遇到异步代码其回调被加入到event table中,遇到同步代码直接执行,遇到微任务如promise中的.then会将其加入到微任务的队列中,当前这个宏任务执行完成,就会去执行微任务,微任务执行完成,也就是完成了一个tick;就会进入到执行下一个tick,又从宏任务到微任务开始执行,这样循环就是事件循环。
案例:
要知道node和浏览器的event loop有差异,这里以浏览器为准
console.log('1');
setTimeout(function() {
console.log('2');
process.nextTick(function() {
console.log('3');
})
new Promise(function(resolve) {
console.log('4');
resolve();
}).then(function() {
console.log('5')
})
})
process.nextTick(function() {
console.log('6');
})
new Promise(function(resolve) {
console.log('7');
resolve();
}).then(function() {
console.log('8')
})
setTimeout(function() {
console.log('9');
process.nextTick(function() {
console.log('10');
})
new Promise(function(resolve) {
console.log('11');
resolve();
}).then(function() {
console.log('12')
})
})
参考资料:
js运行机制:https://segmentfault.com/a/1190000012806637
js运行机制深入浅出:https://zhuanlan.zhihu.com/p/33125763
Js之事件循环(执行机制)的更多相关文章
- JS JavaScript事件循环机制
区分进程和线程 进程是cpu资源分配的最小单位(系统会给它分配内存) 不同的进程之间是可以同学的,如管道.FIFO(命名管道).消息队列 一个进程里有单个或多个线程 浏览器是多进程的,因为系统给它的进 ...
- Node.js 的事件循环机制
目录 微任务 事件循环机制 setImmediate.setTimeout/setInterval 和 process.nextTick 执行时机对比 实例分析 参考 1.微任务 在谈论Node的事件 ...
- 浏览器中 JS 的事件循环机制
目录 事件循环机制 宏任务与微任务 实例分析 参考 1.事件循环机制 浏览器执行JS代码大致可以分为三个步骤,而这三个步骤的往复构成了JS的事件循环机制(如图). 第一步:主线程(JS引擎线程)中执行 ...
- Node.js:事件循环
ylbtech-Node.js:事件循环 1.返回顶部 1. Node.js 事件循环 Node.js 是单进程单线程应用程序,但是通过事件和回调支持并发,所以性能非常高. Node.js 的每一个 ...
- js的事件循环绑定和jQuery的隐式迭代
js的事件循环绑定和jQuery的隐式迭代 js事件循环绑定 jQuery隐式迭代 先举一个例子:给定一个ul,点击列表内的每一个li元素,使它的背景色变红,下边分别用js代码和jQuery实现. & ...
- js的事件循环机制:同步与异步任务(setTimeout,setInterval)宏任务,微任务(Promise,process.nextTick)
javascript是单线程,一切javascript版的"多线程"都是用单线程模拟出来的,通过事件循环(event loop)实现的异步. javascript事件循环 事件循环 ...
- JS:事件循环机制、调用栈以及任务队列
点击查看原文 写在前面 js里的事件循环机制十分有趣.从很多面试题也可以看出来,考察简单的setTimeout也就是考察这个机制的. 在之前,我只是简单地认为由于函数执行很快,setTimeout执行 ...
- JS基础-事件循环机制
从一道题浅说 JavaScript 的事件循环 原文链接: https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/7 ...
- JS浏览器事件循环机制
文章来自我的 github 博客,包括技术输出和学习笔记,欢迎star. 先来明白些概念性内容. 进程.线程 进程是系统分配的独立资源,是 CPU 资源分配的基本单位,进程是由一个或者多个线程组成的. ...
随机推荐
- CH0101 a^b、 CH0102 64位整数乘法(快速幂、快速乘)【模板题】
题目链接:传送门 //a^b 传送门 //64位整数乘法 题目: 描述 求 a 的 b 次方对 p 取模的值,其中 ≤a,b,p≤^ 输入格式 三个用空格隔开的整数a,b和p. 输出格 ...
- C# 8.0、.NET Framework 4.8与NET Standard 2.1的一个说明
C# 8.0..NET Framework 4.8与NET Standard 2.1的一个说明 https://blog.csdn.net/sD7O95O/article/details/846098 ...
- Windows下的matplotlib画图中文显示设置
一.在测试matplotlib时遇到X轴中文字符不显示的问题,参考网上 源代码如下 from matplotlib import pyplot as plt import random import ...
- Apache Kafka 源码剖析
Getting Start 下载 http://kafka.apache.org/ 优点和应用场景 Kafka消息驱动,符合发布-订阅模式,优点和应用范围都共通 发布-订阅模式优点 解耦合 : 两个应 ...
- 《DSP using MATLAB》Problem 5.27
代码: %% +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ %% Outp ...
- 《DSP using MATLAB》Problem 5.1
恰逢清明,这几天是清明时节雪纷纷,断崖式降温:又回到了老家,儿时上蹿下跳的核桃树,远去的故乡,远去的时代…… 用到的公式: 这里只放前两个小题的计算过程,都比较简单,细心就行.代码如下: %% --- ...
- url中携带中文乱码问题
1.问题描述 在项目中碰见url中经常传递中文参数时,容易出现乱码问题,现在就这个问题产生原因和解决的措施大概分析一下,希望过路人和我能引以为戒. 2.问题分析 由于我们利用URL传递参数这种方式是依 ...
- 【BZOJ1067】【SCOI2007】降雨量
新人求助,降雨量那题,本机AC提交AC 原题: 我们常常会说这样的话:“X年是自Y年以来降雨量最多的”.它的含义是X年的降雨量不超过Y年,且对于任意Y<Z<X,Z年的降雨量严格小于X年.例 ...
- immutable-styles 基本试用
此文档来自官方文档,从官方demo 学起比较快 安装 官方推荐的是通过webpack 的构建方式,通过babel loader clone 代码 git clone https://github.co ...
- mtail 提取应用日志数据到时序数据库的工具-支持prometheus
mtail 是谷歌开源的一款很不错的应用日志提取工具,我们可以方便的用来提取应用的数据 到常见的监控系统(prometheus,stats,collectd,gragphite....) 说明: de ...