轮询机制php,JS事件轮询机制讲解

JS是单线程语言，深入理解JS里的Event Loop，本文主要和大家分享JS事件轮询机制，希望能帮助到大家。

JS的执行机制(一)：

1.首先判断JS是同步还是异步,同步就进入主进程,异步就进入event table

2.异步任务在event table中注册函数,当满足触发条件后,被推入event queue

3.同步任务进入主线程后一直执行,直到主线程空闲时,才会去event queue中查看是否有可执行的异步任务,如果有就推入主进程中

JS的执行机制(二)

1.执行一个宏任务,过程中如果遇到微任务,就将其放到微任务的【事件队列】里

2.当前宏任务执行完成后,会查看微任务的【事件队列】,并将里面全部的微任务依次执行完

任务划分方式:

1.macro-task(宏任务)：script，setTimeout，setInterval

2.micro-task(微任务)：Promise，process.nextTick

我们从一道小题目出发for (var i=0;i<=5;i++){

setTimeout(()=>{console.log(i)},1000)

}

输出结果应该是1s之后连续打印6个6，虽然这个题目的主要知识点是块级作用域，但非常适合用来引出事件轮询机制。因为setTimeout是异步任务，所以不会立即执行，它需要等到所有的同步任务执行完毕，即for循环结束，当i变为6时开始同时执行6个定时器，此时i指向值为6的全局变量，所以打印6，这就是JS执行机制(一)

加点难度，考虑JS执行机制(二)// promise里面的函数是立即执行的// 分别输出 2 3 5 4 1setTimeout(function () {

console.log(1)

},0);new Promise(function executor(resolve) {

console.log(2); for(var i=0;i<10000;i++){

i==9999 && resolve();

}

console.log(3);

}).then(function () {

console.log(4);

});

console.log(5);

首先执行的第一个宏任务肯定是脚本(script)，所以定时器会被跳过(不论你延迟几秒执行)，紧接着执行Promise里面的内容，按顺序执行，先打印2，然后进行for循环，resolve()是异步回调函数，属于异步执行的内容，同时如我们在任务划分里面提到的，Promise属于微任务，所以会在宏任务结束之后清空微任务事件队列，所以接下来会打印3，5，4。

至此第一个宏任务便处理完毕，然后才会轮到定时器。

轮询机制php,JS事件轮询机制讲解相关推荐

JS事件轮询机制（Event Loop）
概念事件轮询 (eventloop) 是"一个解决和处理外部事件时将它们转换为回调函数的调用的实体(entity)" JavaScript 语言的一大特点就是单线 ...
react 引入轮播插件_React.js实现轮播图
react.js的基本思想,是通过改变state或props的值,重新渲染用户界面(不用操作DOM).截图GIF效果如下(只截取了三页效果): GIF1.gif 1.文件列表: 1490606951( ...
html图片轮播放大,jquery+CSS3实现轮播图、js实现轮播图片自适应等比显示、图片旋转、图片拖拽、鼠标滚动放大缩小...
// 实现图片旋转自适应外边框 //算法:1.当图片宽和高同时大于外边框时以宽为标准100%(相对外边框)进行自适应,原图不变垂直水平居中显示 2.当图片宽大于外边框宽,高小于外边框高时,以宽为标准1 ...
Node.js的事件轮询Event Loop原理解释
事件轮询主要是针对事件队列进行轮询,事件生产者将事件排队放入队列中,队列另外一端有一个线程称为事件消费者会不断查询队列中是否有事件,如果有事件,就立即会执行,为了防止执行过程中有堵塞操作影响当前线程读 ...
事件轮询(Event Loop) 宏任务与微任务
事件轮询(Event Loop) 宏任务与微任务文章目录事件轮询(Event Loop) 宏任务与微任务前言 Javascript诞生 Javascript如何执行 Event Loop是什么? ...
轮播图实现html,html、css、js实现轮播图
2017-03-13 今天把轮播图的知识1过了一下,写了一个比较简单的轮播图,给大家参考一下. 查看具体的效果点击这个链接 : http://gjhnstxu.me/%E8%BD%AE%E6%92%A ...
css轮播箭头怎么隐藏,CSS——轮播图中的箭头
注意事项: 1.定位中left权重比right高,top权重比bottom高 2.两个span标签嵌套在一个盒子中,将来显示隐藏只需要控制父盒子就行了 .box { width: 400px; hei ...
JS事件相关知识点整理
JS事件相关知识点整理 JS事件的驱动机制常见JS事件点击事件---onclick 焦点事件获取焦点事件---onfocus 失去焦点事件----onblur 域内容改变事件---onchang ...
Java中事件监听机制
Java中事件监听机制一.事件监听机制的定义要想了解Java中的事件监听机制,首先就要去了解一下在Java中事件是怎样去定义的呢!在使用Java编写好一个界面后,我们就会对界面进行一些操作,比如, ...

轮询机制php,JS事件轮询机制讲解

轮询机制php,JS事件轮询机制讲解相关推荐

最新文章

热门文章