js 事件循环机制 EventLoop
js 的非阻塞I/O 就是由事件循环机制实现的
众所周知 js是单线程的 也就是上一个任务完成后才能开始新的任务
那js碰到ajxa和定时器、promise这些异步任务怎么办那?这时候就出现了事件队列。
js的主要执行栈 称为主栈
用ajax举例:
代码执行的时候如果遇到ajax怎么办,ajax事件的实现 是浏览器上的一个功能或者说是线程,当js主栈执行到ajax事件,js会告诉浏览器让浏览器去请求,然后js主栈不会去等ajax是否请求成功,js主栈继续执行,等所有js的同步任务执行完之后,js主栈就会读取这个“事件队列”了,把事件队列里面的第一个事件,压入主栈执行,那么事件队列的里的事件是怎么来的那?(主线程从"事件队列"中读取事件,这个过程是循环不断的,所以整个的这种运行机制又称为Event Loop(事件循环))
刚才说过js的主栈执行到ajax事件,js会告诉浏览器让浏览器去请求,然后浏览器请求并且返回结果,那么那他会把,ajax的回调函数放到事件队列的尾部,ajax完成时间是不定的,如果网络延迟它可能很慢才有结果,这个时候 js的主栈把所有任务都执行完毕了,而且因为ajax没有返回结果,那么js主栈的主栈会循环不断的查看事件队列里面有没有可执行的事件(回调函数),也就是说ajax什么时候返回,js主栈什么时候执行ajax的回调函数。(其他的异步任务也是一样的,promise是直接把当前的回调函数放到事件队列里面)
上面说的事件循环机制,就形成为了非阻塞I/O。
下面举个例子来测试一下吧:


这里说明下,setTimeout()也是浏览器上的,他没有设置时间,但是setTimeout()最快执行速度3毫秒(注意这里说的是最快执行速度)说明他的时间是不准确的。
Promise是立刻向事件队列里面添加一个回调函数,所以比setTImeout快。这也就能解释他的执行顺序了。
刚才我说setTimeout 执行时间是不准确的,如果设置setTimeout 执行时间是5毫秒,是因为他最后执行完是向事件队列里面添加的,如果我的主栈的的代码计算量庞大,是10毫秒,那么你们想想,执行setTimeout回调的时间不就是10毫秒了吗?
js 事件循环机制 EventLoop的更多相关文章
- js事件循环机制辨析
对于新接触js语言的人来说,最令人困惑的大概就是事件循环机制了.最开始这也困惑了我好久,花了我几个月时间通过书本,打代码,查阅资料不停地渐进地理解他.接下来我想要和大家分享一下,虽然可能有些许错误的 ...
- js事件循环机制 (Event Loop)
一.JavaScript是单线程单并发语言 什么是单线程 主程序只有一个线程,即同一时间片断内其只能执行单个任务. 为什么选择单线程? JavaScript的主要用途是与用户互动,以及操作DOM.这决 ...
- JS 事件循环机制 - 任务队列、web API、JS主线程的相互协同
一.JS单线程.异步.同步概念 从上一篇说明vue nextTick的文章中,多次出现“事件循环”这个名词,简单说明了事件循环的步骤,以便理解nextTick的运行时机,这篇文章将更为详细的分析下事件 ...
- Node.js 事件循环机制
Node.js 采用事件驱动和异步 I/O 的方式,实现了一个单线程.高并发的 JavaScript 运行时环境,而单线程就意味着同一时间只能做一件事,那么 Node.js 如何通过单线程来实现高并发 ...
- js事件循环机制(Event Loop)
javascript从诞生之日起就是一门 单线程的 非阻塞的 脚本语言,单线程意味着,javascript代码在执行的任何时候,都只有一个主线程来处理所有的任务,非阻塞靠的就是 event lo ...
- js事件循环机制
本文参考链接:https://www.jianshu.com/p/cf47bc0bf2ab 一.先搞懂两个东西:堆和栈 栈由操作系统自动分配释放,用于存放函数的参数值.局部变量等一些基本的数据类型,其 ...
- JS:事件循环机制、调用栈以及任务队列
点击查看原文 写在前面 js里的事件循环机制十分有趣.从很多面试题也可以看出来,考察简单的setTimeout也就是考察这个机制的. 在之前,我只是简单地认为由于函数执行很快,setTimeout执行 ...
- Netty源码解析 -- 事件循环机制实现原理
本文主要分享Netty中事件循环机制的实现. 源码分析基于Netty 4.1 EventLoop 前面分享服务端和客户端启动过程的文章中说过,Netty通过事件循环机制(EventLoop)处理IO事 ...
- 对javascript EventLoop事件循环机制不一样的理解
前置知识点: 浏览器原理,浏览器内核5种线程及协作,JS引擎单线程设计推荐阅读: 从浏览器多进程到JS单线程,JS运行机制最全面的一次梳理 [FE]浏览器渲染引擎「内核」 js异步编程,Promise ...
随机推荐
- POJ3169 差分约束 线性
Layout Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 12522 Accepted: 6032 Descripti ...
- RelativeLayout属性大全
- Test for Job 图上的动态规划(DAG)
Test for Job Time Limit: 5000MS Memory Limit: 65536K Total Submissions: 11399 Accepted: 2697 Des ...
- Codeforces 651D Image Preview【二分+枚举】
题意: 若干张照片,从头开始可以向左右两边读,已经读过的不需要再读,有的照片需要翻转,给定读.滑动和翻转消耗的时间,求在给定时间内最多能读多少页? 分析: 首先明确,只横跨一次,即先一直读一边然后再一 ...
- Java并发包——线程通信
Java并发包——线程通信 摘要:本文主要学习了Java并发包里有关线程通信的一些知识. 部分内容来自以下博客: https://www.cnblogs.com/skywang12345/p/3496 ...
- Ubuntu 16.04安装Intel显卡驱动(解决Intel HD Graphics 630显卡驱动问题)
一般Ubuntu都默认包含了Intel显卡的驱动,如果没有,那么先确定是不是显卡太高,比如I7第7代的CPU核显在Ubuntu 16.04中是没有的,导致画面会很卡,原因是Linux 4.4内核不包含 ...
- html上传图片类型
<html> <head> <meta charset="utf-8"> <title>上传图片</title> ...
- java MAT 分析
java MAT 分析 http://blog.csdn.net/qeqeqe236/article/details/43577857 https://www.cnblogs.com/AloneSwo ...
- Justinmind使用教程(2)——计算表达式及条件用法
Justinmind的计算表达式以及条件condition的使用对于刚開始学习的人而言比較麻烦. 结合网上了一个教程本文主要针对计算器演示样例进行计算表达式以及条件的使用. 实现目标:依据单位价格(静 ...
- OCP-1Z0-051-题目解析-第21题
21. Examine the description of the EMP_DETAILS table given below: name NULL ...