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. http解析过程

    HTTP协议定义Web客户端如何从Web服务器请求Web页面,以及服务器如何把Web页面传送给客户端.HTTP协议采用了请求/响应模型.客户端向服务器发送一个请求报文,请求报文包含请求的方法.URL. ...

  2. PTA——天平找小球

    PTA 7-22 用天平找小球 #include<stdio.h> int main() { int a,b,c; scanf("%d%d%d",&a,& ...

  3. RESTful规范(二)

    七 解析器 解析器的作用: -用来解析前台传过来的数据编码方式 urlencoded:form表单:name=lqz&age= formdata :上传文件:--dadfgdgag-- jso ...

  4. 《DSP using MATLAB》Problem 5.36

    第1小题 代码: %% ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ ...

  5. python------软件目录结构规范

    一. 目录结构 www.cnblogs.com/alex3714/articles/5765046.html print(__file__) 获得相对路径 import osprint(os.path ...

  6. jsp的服务器响应,out.println 与response.setIntHeader的报错解决方案,附:导入jar包的方法

    在九大内置对象中,笔者认为用的最多的就是out.println 与response.setIntHeader,今天刚写了一个服务器响应的代码,也总是这两个报错.具体请看图. 先来说说response. ...

  7. jsp页面继承

    功能类似 django template 中的  extends 功能 使用 1.需要下载rapid-core-4.0.jar    导入到web-inf下lib中   下载地址   http://w ...

  8. Python——scapy模块实现tcp探测目标服务器路由轨迹

      scapy模块的安装 484 yum install tcpdump graphviz ImageMagick -y 485 wget http://www.secdev.org/projects ...

  9. 使用Intellij IDEA新建Web项目

    在学习Servlet的过程中,发现大多数的教程都是使用MyEclipse或者Eclipse来创建Web项目,这让一直使用高逼格的LZ很是不爽,于是自己配置了一下使用Intellij IDEA新建了We ...

  10. ipfs cluster 模式部署使用(docker-compose 环境运行)

    ipfs 点对点的分布式文件系统,官方提供了集群模式运行的docker 镜像,以及docker-compose 文件 所以测试下 环境准备 docker-compose   version: '3.4 ...