js 队列和事件循环
1.示例代码
<!DOCTYPE html>
<html lang="zh"> <head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>js队列</title>
</head> <body>
<script type="text/javascript"> setTimeout(function() {
console.log('timeout1')
},0)
setTimeout(function() {
console.log('timeout2')
},10)
new Promise(function(resolve) {
console.log('promise1')
for(var i = 0; i < 1000; i++) {
i == 99 && resolve()
}
console.log('promise2')
}).then(function() {
console.log('then1')
}).then(function(){
console.log('then2')
})
console.log('global1')
</script>
</body> </html>
控制台输出:

2、队列
setTimeout、setInterval和事件绑定中的代码,通过队列来执行。不是函数调用栈。
任务队列分为:宏任务(macro-task)和微任务(micro-task)。
macro-task:script(整体代码)、setTimeout、setInterval、I/O
micro-task:Primise
3、执行顺序
(1)宏任务的script
(2)执行micro-task,执行完后 第一次事件循环结束
(3)在执行宏任务中的其他任务,如setTimeout。在执行在其他任务如setTimeout可能产生的微任务。微任务执行完毕后再执行其他宏任务队列中的任务。直到宏任务队列中的任务都被执行一遍,并且清空了微任务,第二次循环结束。
(4)如果第二次循环中产生了新的宏任务,或者之前的宏任务没有满足执行条件(如有延迟时间或等待事件触发),那么会继续以同样的顺序重复循环。
js 队列和事件循环的更多相关文章
- 消息队列和事件循环(Event Loop)
产生原因 为什么会有消息队列和事件循环呢?首先最关键的一点在于JS是个单线程,并且主线程非常繁忙,既要处理 DOM,又要计算样式,还要处理布局,同时还需要处理 JavaScript 任务以及各种输入事 ...
- JS 单线程和事件循环
Js 是单线程,js代码从上到下依次执行,比如我们写了两个函数,肯定是上面的函数先执行,下面的函数后执行.但是这种单线程有一个非常大的问题,那就是遇到耗时的任务,后面的任务只能等待它执行完,才能进行. ...
- JS执行机制--事件循环--笔记
JS的解析是由浏览器中的JS解析引擎完成的.JS是单线程运行,也就是说,在同一个时间内只能做一件事,所有的任务都需要排队,前一个任务结束,后一个任务才能开始.但是又存在某些任务比较耗时,如IO读写等, ...
- js高级-浏览器事件循环机制Event Loop
JavaScript 是队列的形式一个个执行的 同一时间只能执行一段代码,单线程的 (队列的数据结构) 浏览器是多线程的 JavaScript执行线程负责执行js代码 UI线程负责UI展示的 Jav ...
- 【nodejs原理&源码赏析(7)】【译】Node.js中的事件循环,定时器和process.nextTick
[摘要] 官网博文翻译,nodejs中的定时器 示例代码托管在:http://www.github.com/dashnowords/blogs 原文地址:https://nodejs.org/en/d ...
- 【nodejs原理&源码赏析(7)】【译】Node.js中的事件循环,定时器和process.nextTick
目录 Event Loop 是什么? Event Loop 基本解释 事件循环阶段概览 事件循环细节 timers pending callbacks poll阶段 check close callb ...
- js异步、事件循环(EventLoop)小结
单线程 众所周知,JS是单线程的语言,之所以是单线程,用一句烂大街的话就是,如果两个线程同时操作一个DOM节点,那么该以哪个为准呢,虽然多线程也有办法解决,但是js毕竟是浏览器脚本语言,不需要那么复杂 ...
- js event loop事件循环
浏览器环境 以下两段代码是等价的.req对事件的回调设置,实际上就是当前主线程任务队列的任务. var req = new XMLHttpRequest(); req.open('GET', url) ...
- 0182 JavaScript执行机制:单线程,同步任务和异步任务,执行栈,消息队列,事件循环
以下代码执行的结果是什么? [结果是1 2 3 ] console.log(1); setTimeout(function () { console.log(3); }, 1000); console ...
随机推荐
- java中Math.abs(-2147483648)的返回值应该是什么?
我觉得这是一个非常有意思的问题,Math.abs(-2147483648)的返回值应该是什么? java计算结果 为什么没有得到正数结果呢? 首先我们先看下java区分整数正负的原理.在二进制的情况下 ...
- Qt笔记——QFile,QDataStream,QTextStream
QFile #ifndef WIDGET_H #define WIDGET_H #include <QWidget> namespace Ui { class Widget; } clas ...
- django CXRF介绍
CSRF(Cross-site request forgery)跨站请求伪造,是攻击者利用用户的身份操作用户帐户的一种攻击方式.和XSS攻击一样,存在巨大的危害性. 一.攻击方法 1.低级的CXRF攻 ...
- Chief Technology Officer
转自地址:http://www.swoole.com/News/76.html 1)错误都是自上而下 当事情出现混乱的时候,人们总是寻求寄托于Process的制定,很多的管理者,觉察到事情的失控,却不 ...
- 安装和破解Quartus Ⅱ 15.0
http://jingyan.baidu.com/article/b7001fe18d47fc0e7282dd91.html
- 洛谷 P2415 集合求和【数学公式/模拟】
给定一个集合s(集合元素数量<=30),求出此集合所有子集元素之和. 输入输出格式 输入格式: 集合中的元素(元素<=1000) 输出格式: 和 输入输出样例 输入样例#1: 2 3 输出 ...
- ZCMU训练赛-J(循环节+字符串处理)
J - Java Beans There are N little kids sitting in a circle, each of them are carrying some java bean ...
- ACM-ICPC 2018 沈阳赛区网络预赛 D. Made In Heaven(第k短路模板)
求第k短路模板 先逆向求每个点到终点的距离,再用dij算法,不会超时(虽然还没搞明白为啥... #include<iostream> #include<cstdio> #inc ...
- 礼物(BFS)
礼物 时间限制: 1 Sec 内存限制: 64 MB提交: 39 解决: 4[提交][状态][讨论版] 题目描述 给出一个n行m列的点阵,“.”表示可通行格子,“#”表示不可通行格子,“K”表示国 ...
- 【Android】自定义View
内置组件经常不满足我们的需求,那么就要自己来重写了,一般需要实现以下几个父类方法: 1.onMeasure 决定内部View的宽和高,以及自身的宽和高 2.onLayout 决定子View的放置位置 ...