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之事件循环(执行机制)的更多相关文章

  1. JS JavaScript事件循环机制

    区分进程和线程 进程是cpu资源分配的最小单位(系统会给它分配内存) 不同的进程之间是可以同学的,如管道.FIFO(命名管道).消息队列 一个进程里有单个或多个线程 浏览器是多进程的,因为系统给它的进 ...

  2. Node.js 的事件循环机制

    目录 微任务 事件循环机制 setImmediate.setTimeout/setInterval 和 process.nextTick 执行时机对比 实例分析 参考 1.微任务 在谈论Node的事件 ...

  3. 浏览器中 JS 的事件循环机制

    目录 事件循环机制 宏任务与微任务 实例分析 参考 1.事件循环机制 浏览器执行JS代码大致可以分为三个步骤,而这三个步骤的往复构成了JS的事件循环机制(如图). 第一步:主线程(JS引擎线程)中执行 ...

  4. Node.js:事件循环

    ylbtech-Node.js:事件循环 1.返回顶部 1. Node.js 事件循环 Node.js 是单进程单线程应用程序,但是通过事件和回调支持并发,所以性能非常高. Node.js 的每一个 ...

  5. js的事件循环绑定和jQuery的隐式迭代

    js的事件循环绑定和jQuery的隐式迭代 js事件循环绑定 jQuery隐式迭代 先举一个例子:给定一个ul,点击列表内的每一个li元素,使它的背景色变红,下边分别用js代码和jQuery实现. & ...

  6. js的事件循环机制:同步与异步任务(setTimeout,setInterval)宏任务,微任务(Promise,process.nextTick)

    javascript是单线程,一切javascript版的"多线程"都是用单线程模拟出来的,通过事件循环(event loop)实现的异步. javascript事件循环 事件循环 ...

  7. JS:事件循环机制、调用栈以及任务队列

    点击查看原文 写在前面 js里的事件循环机制十分有趣.从很多面试题也可以看出来,考察简单的setTimeout也就是考察这个机制的. 在之前,我只是简单地认为由于函数执行很快,setTimeout执行 ...

  8. JS基础-事件循环机制

    从一道题浅说 JavaScript 的事件循环 原文链接: https://github.com/Advanced-Frontend/Daily-Interview-Question/issues/7 ...

  9. JS浏览器事件循环机制

    文章来自我的 github 博客,包括技术输出和学习笔记,欢迎star. 先来明白些概念性内容. 进程.线程 进程是系统分配的独立资源,是 CPU 资源分配的基本单位,进程是由一个或者多个线程组成的. ...

随机推荐

  1. CH0101 a^b、 CH0102 64位整数乘法(快速幂、快速乘)【模板题】

    题目链接:传送门    //a^b   传送门    //64位整数乘法 题目: 描述 求 a 的 b 次方对 p 取模的值,其中 ≤a,b,p≤^ 输入格式 三个用空格隔开的整数a,b和p. 输出格 ...

  2. 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 ...

  3. Windows下的matplotlib画图中文显示设置

    一.在测试matplotlib时遇到X轴中文字符不显示的问题,参考网上 源代码如下 from matplotlib import pyplot as plt import random import ...

  4. Apache Kafka 源码剖析

    Getting Start 下载 http://kafka.apache.org/ 优点和应用场景 Kafka消息驱动,符合发布-订阅模式,优点和应用范围都共通 发布-订阅模式优点 解耦合 : 两个应 ...

  5. 《DSP using MATLAB》Problem 5.27

    代码: %% +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ %% Outp ...

  6. 《DSP using MATLAB》Problem 5.1

    恰逢清明,这几天是清明时节雪纷纷,断崖式降温:又回到了老家,儿时上蹿下跳的核桃树,远去的故乡,远去的时代…… 用到的公式: 这里只放前两个小题的计算过程,都比较简单,细心就行.代码如下: %% --- ...

  7. url中携带中文乱码问题

    1.问题描述 在项目中碰见url中经常传递中文参数时,容易出现乱码问题,现在就这个问题产生原因和解决的措施大概分析一下,希望过路人和我能引以为戒. 2.问题分析 由于我们利用URL传递参数这种方式是依 ...

  8. 【BZOJ1067】【SCOI2007】降雨量

    新人求助,降雨量那题,本机AC提交AC 原题: 我们常常会说这样的话:“X年是自Y年以来降雨量最多的”.它的含义是X年的降雨量不超过Y年,且对于任意Y<Z<X,Z年的降雨量严格小于X年.例 ...

  9. immutable-styles 基本试用

    此文档来自官方文档,从官方demo 学起比较快 安装 官方推荐的是通过webpack 的构建方式,通过babel loader clone 代码 git clone https://github.co ...

  10. mtail 提取应用日志数据到时序数据库的工具-支持prometheus

    mtail 是谷歌开源的一款很不错的应用日志提取工具,我们可以方便的用来提取应用的数据 到常见的监控系统(prometheus,stats,collectd,gragphite....) 说明: de ...