浏览器环境

以下两段代码是等价的。req对事件的回调设置,实际上就是当前主线程任务队列的任务。

    var req = new XMLHttpRequest();
req.open('GET', url);
req.onload = function (){};
req.onerror = function (){};
req.send(); //equal var req = new XMLHttpRequest();
req.open('GET', url);
req.send();
req.onload = function (){};
req.onerror = function (){};

setTimeout(fn,0):往消息队列尾部添加一条消息,指定主线程有空的时候(所有同步任务执行完),要尽快执行fn函数

对于事件循环应该这么理解:

  主线程中有一个(同步)任务队列,另一个地方又有一个消息队列。

  仅当任务队列为空时,主线程才会去检查消息队列,取消息,然后把对应的回调函数以一个任务的形式插入到主线程的任务队列中。

  当任务队列不为空时,主线程会不停地从任务队列中取出任务,执行。直到任务队列为空,这个过程称为一次事件循环

  事件循环实际上就是主线程【执行任务】和【取消息、插入任务】的过程,两部分不停循环

可见主线程所做的事情就是,执行任务、取消息、插入任务。那插入消息这个过程谁来做?

  这里引入一个概念叫做“工作线程”,主线程执行任务时,可能会开启异步任务(如ajax,timeout等),这时实际上就是通知一个工作线程去执行这个异步任务,执行完成后,这个工作线程就往消息队列中插入一个消息,表示通知主线程,你交给我的任务我已经搞定啦

根据以上的理解可以发现,消息和回调函数必定是一一对应的。看看这个例子

var getMsg = new Promise(function(resolve,reject){
console.log('begin...');
resolve('ok');
});
getMsg.then(function(data){
console.log(data);
});
console.log('last');

运行输出:

begin...
last
ok

对于promise,看起来像触发回调的时候,这个回调还没定义。但实际上不是这样的,promise内置的回调会执行,然后这个内置的回调会调用我们自定义的回调方法而已,也就是说我们定义的回调方法是间接被调用的

node环境

node的事件循环不属于v8引擎的一部分,它由libuv库提供

process.nextTick:往主线程的同步任务队列尾部添加一个任务,这意味着这个任务执行在所有回调函数之前

setImmediate:和setTimeout(fn,0)类似

可见:

  process.nextTick 和 setImmediate 相比,前者明显要高效与后者,因为前者运行在当前的事件循环中,不需要去检查消息队列

js event loop事件循环的更多相关文章

  1. node.js中对Event Loop事件循环的理解

    javascript是单线程的,所以任务的执行都需要排队,任务分为两种,一种是同步任务,一种是异步任务. 同步任务是进入主线程上排队执行的任务,上一个任务执行完了,下一个任务才会执行. 异步任务是不进 ...

  2. 为什么JS是单线程?JS中的Event Loop(事件循环)?JS如何实现异步?setimeout?

    https://segmentfault.com/a/1190000012806637 https://www.jianshu.com/p/93d756db8c81 首先,请牢记2点: (1) JS是 ...

  3. Event Loop事件循环,GET!

    JS中比较让人头疼的问题之一要算异步事件了,比如我们经常要等后台返回数据后进行dom操作,又比如我们要设置一个定时器完成特定的要求.在这些同步与异步事件里,异步事件肯定是在同步事件之后的,但是异步事件 ...

  4. javascript的event loop事件循环

    javascript的event loop事件循环 这是今天一个朋友发给我的一个面试题, 感觉还挺有意思的, 写个博客以供分享 先看看这个面试题目: 观察下面的代码,写出输出结果 console.lo ...

  5. 浅谈 Event loop (事件循环)

    从Event Loop谈JS的运行机制 先来理解一个概念: JS分为同步任务和异步任务 同步任务都在主线程上执行,形成一个执行栈 Execute Content Stack 主线程之外,事件触发线程管 ...

  6. 进程,线程,Event Loop(事件循环),Web Worker

    线程,是程序执行流的最小单位.线程可与同属一个进程的其他线程共享所拥有的全部资源,同一进程中的多个线程之间可以并发执行.线程有就绪,阻塞,运行三种基本状态. 阮一峰大神针对进程和线程的类比,很是形象: ...

  7. JavaScript event loop事件循环 macrotask与microtask

    macrotask  姑且称为宏任务,在很多上下文也被简称为task.例如: setTimeout, setInterval, setImmediate, I/O, UI rendering. mic ...

  8. The Node.js Event Loop, Timers, and process.nextTick() Node.js事件循环,定时器和process.nextTick()

    个人翻译 原文:https://nodejs.org/en/docs/guides/event-loop-timers-and-nexttick/ The Node.js Event Loop, Ti ...

  9. Node.js event loop 和 JS 浏览器环境下的事件循环的区别

    Node.js  event loop 和 JS 浏览器环境下的事件循环的区别: 1.线程与进程: JS 是单线程执行的,指的是一个进程里只有一个主线程,那到底什么是线程?什么是进程? 进程是 CPU ...

随机推荐

  1. 第十八篇 .NET高级技术之Linq与EF Code-First Fluent API基础讲解

    1.FluentApi简介 在这里提供了一个fluentapi基础的DEMO然后咱们在进一步的学习,直接上干货. 第一步在数据库创建一个表:person 第二步:新建控制台程序FluentAPI 第三 ...

  2. LuoguP1342请柬 【最短路/建反图】By cellur925

    题目传送门 开始就想直接正向跑一遍Dij把到各点的最短路加起来即可,后来发现与样例少了些,于是再读题发现需要也求出学生们回来的最短路. 但是注意到本题是有向图,如果是无向图就好说. 那么我们怎么解决? ...

  3. [USACO10MAR]伟大的奶牛聚集Great Cow Gat…【树形dp】By cellur925

    题目传送门 首先这道题是在树上进行的,然后求最小的不方便程度,比较符合dp的性质,那么我们就可以搞一搞树形dp. 设计状态:f[i]表示以i作为聚集地的最小不方便程度.那么我们还需要各点间的距离,但是 ...

  4. [MySQL] LIMIT 分页优化

    背景:LIMIT 0,20 这种分页方式,随着 offset 值的不断增大,当达到百万级时,一条查询就需要1秒以上,这时可以借助索引条件的查询来优化. SQL:select * from member ...

  5. hdu1301 Jungle Roads 基础最小生成树

    #include<iostream> #include<algorithm> using namespace std; ; int n, m; ]; struct node { ...

  6. 基于坐标的自动化测试神器---Total Control快速入门

    1.Total Control简单介绍 一款能够在PC上控制手机的软件,同时可以使用PC 触摸屏.鼠标.键盘, 全面操控 Android 手机,只需通过 USB 或 WiFi 连接手机至电脑,即可随时 ...

  7. git分支提交管理

    随着需求的增多,为了多人协作的顺利进行,需要进行分支开发,进而带来分支管理问题.今天主要讲一下如何管理分支及提交. 为了使git更好用,下面是我的git配置文件(放在C:\Users\Administ ...

  8. 《Redis开发与运维》快速笔记(一)

    1.前言&基本介绍 在原始的系统架构中,我们都由程序直接连接DB,随着业务的进一步开展,DB的压力越来越大,为了缓解DB的这一压力,我们引入了缓存,在程序连接DB中加入缓存层, 从而减轻数据库 ...

  9. Android手机屏幕投射到电脑神器Vysor

    做android开发的,经常要把手机屏幕投射到电脑,用来演示.普遍的解决方案是360或者豌豆荚的演示功能,缺点是延迟非常厉害,大概有3秒左右,非常影响演示效果.以下介绍Vysor,几乎0延迟,能与手机 ...

  10. ios 从相册视频中获取视频截图

    //给image添加个分类 +(UIImage *)getImage:(NSURL: *)videoURL { AVURLAsset *asset = [[AVURLAsset alloc] init ...