JS中的执行机制(setTimeout、setInterval、promise、宏任务、微任务)
1、执行机制
JS 是单线程的,处理 JS 任务(程序)只能一个一个顺序执行,所以 JS 中就把任务分为了同步任务和异步任务。同步的进入主线程先执行,异步的进入Event Table并注册函数,当指定的事情完成时,Event Table会将这个函数移入事件队列Event Queue,等待主线程内的任务执行完毕,然后就会从事件队列 Event Queue 中读取对应的函数,进入主线程执行。
除了广义的同步任务和异步任务,JS 对任务还有更精细的定义:
- macro-task(宏任务):包括整体代码script,setTimeout,setInterval
- micro-task(微任务):Promise,process.nextTick
微任务先于宏任务执行(除了一开始的整体代码 script)。执行过程中,不同类型的任务会进入对应的事件队列Event Queue,比如setTimeout和setInterval会进入相同的Event Queue。
1.1、执行优先级
- 同步代码执行顺序优先级高于异步代码执行顺序优先级
- process.nextTick() > Promise.then() > setTimeout > setImmediate
(注意:process.nextTick 是 node 中的方法,而在浏览器中执行时(比如在vue项目中),会退化成setTimeout,所以在浏览器中 process.nextTick 会比 Promise.then() 慢)
1.2、总结
总得来说,在 JS 中,先是执行整体的同步任务代码,遇到微任务就会将其放在微任务事件队列,遇到宏任务就会放在宏任务事件队列中。
然后整体的同步任务代码执行完后,就会先执行微任务队列中的任务,等待微任务队列中的所有任务执行完毕后,此时才会从宏任务队列中找到第一个任务进行执行。该任务执行过程中,如果遇到微任务就会放到微任务队列中,等到该任务执行完后,就会查看微任务队列中有没有微任务,如果有就先执行完微队列中的任务,否则执行第二个宏任务。以此类推。
详细参考:https://juejin.im/post/59e85eebf265da430d571f89
JS中的执行机制(setTimeout、setInterval、promise、宏任务、微任务)的更多相关文章
- js异步处理工作机制(setTimeout, setInterval)
经常谈到异步,但是发现自己一直没深入理解setTimeout, setInterval,逛论坛的时候发现了这篇好文章,分享一下. ————————————————————以下为原文—————————— ...
- JS 引擎的执行机制
关于JS引擎的执行机制,首先牢记2点: .JS是单线程语言 JS的Event Loop是JS的执行机制.深入了解JS的执行,就等于深入了解JS里的event loop 关于单线程相对还比较好理解,就是 ...
- js为什么是单线程的?10分钟了解js引擎的执行机制
深入理解JS引擎的执行机制 1.JS为什么是单线程的? 为什么需要异步? 单线程又是如何实现异步的呢? 2.JS中的event loop(1) 3.JS中的event loop(2) 4.说说setT ...
- JS引擎的执行机制:探究EventLoop(含Macro Task和Micro Task)
在我看来理解好JS引擎的执行机制对于理解JS引擎至关重要,今天将要好好梳理下JS引擎的执行机制. 首先解释下题目中的名词:(阅读本文后你会对这些概念掌握了解) Event Loop:事件循环Micro ...
- JS引擎的执行机制
深入理解JS引擎的执行机制 1.灵魂三问 : JS为什么是单线程的? 为什么需要异步? 单线程又是如何实现异步的呢? 2.JS中的event loop(1) 3.JS中的event loop(2) 4 ...
- [转]JS 引擎的执行机制
转: https://www.cnblogs.com/wancheng7/p/8321418.html ------------------------------------------------ ...
- 深入理解JS引擎的执行机制
深入理解JS引擎的执行机制 1.灵魂三问 : JS为什么是单线程的? 为什么需要异步? 单线程又是如何实现异步的呢? 2.JS中的event loop(1) 3.JS中的event loop(2) 4 ...
- 别再为了this发愁了------JS中的this机制
别再为了this发愁了------JS中的this机制 题记:JavaScript中有很多令人困惑的地方,或者叫做机制.但是,就是这些东西让JavaScript显得那么美好而与众不同.比方说函数也是对 ...
- 再次讲解js中的回收机制是怎么一回事。
在前几天的一篇闭包文章中我们简单的介绍了一下闭包,但是并没有深入的讲解,因为闭包涉及的知识点比较多,为了能够更好的理解闭包,今天讲解一下关于js中的回收机制. 在初识闭包一文中我说过js中有回收机制这 ...
随机推荐
- 正则表达式——Unicode 匹配规则
一般来说,数字字符解释[0-9],单词字符就是[0-9a-zA-Z_],空白字符则包括空格.回车等字符,但这是 ASCII 编码中的情况,在 Unicode 编码中并非如此. 因为包括了多种语 ...
- 通过vue-router实现组件间的跳转
三.通过VueRouter来实现组件之间的跳转提供了3种方式实现跳转:①直接修改地址栏中的路由地址 <!doctype html> <html> <head> &l ...
- Java之类的继承
说起来Java的类,不得不说以下几个方面:继承.转型.重写.多态和接口. 今天来说一说继承,转型和重写几个方面: 继承(extends)即子类继承父类,就好比玻璃杯.保温杯等子类继承了杯子这个父类,子 ...
- 深入理解java:1.2. 字节码执行引擎
执行引擎是Java虚拟机的核心组成部分之一. 首先,想想C++和Java在编译和运行时到底有啥不一样? 下图左边,C++发布的就是机器指令, 而下图右边Java发布的是字节码,字节码在运行时通过JVM ...
- python+selenium切换窗口(获取句柄信息)
current_window_handle:获得当前窗口句柄: window_handles:返回所有窗口的句柄到当前会话: switch_to.window(suoyou[0]) ========= ...
- [Git] 020 stash —— Git 中的”皮姆粒子“
0. 我准备模拟两种情况 第一种 第二种 情况简析 仓库中的最新版本发现 Bug,需要立即修复 当前在 "dev" 分支中工作到一定程度,尚不能提交,但删之可惜 ps: 在分支中没 ...
- linux中断处理上下部分
一.linux中断处理为什么要分为上下部 1.1. 中断处理的上半部(top half,又叫顶半部)和处理的下半部(bottom half,又叫底半部) 1.1. linux中断处理不参与调度,故中断 ...
- vuex辅助函数和vuex5个属性
在上篇中,我们可以知道如果想要访问vuex.store中state中的数据,需要this.$store.state.属性名.显然这样访问数据写的代码很很不简洁的,辅助函数就是用来解决这个问题的. 1. ...
- sklearn逻辑回归库函数直接拟合数据
from sklearn import model_selection from sklearn.linear_model import LogisticRegression from sklearn ...
- Tengine 补充
Tengine 补充 开机启动 chkconfig --list chkconfig --add nginx chkconfig nginx on 时间问题 service ntpd status 虚 ...