JavaScript Event Loop相关原理解析


Posted in Javascript onJune 10, 2020

1.单线程模型

单线程模型指的是,JavaScript只能在一个线程上运行,也就是说只能同时指向一个任务,其他任务都必须在后面排队等待。注意:虽然JavaScript只在一个线程上运行,但并不代码JavaScript引擎只有一个线程。事实上,JavaScript引擎有多个线程,单个脚本只能在一个线程上运行(主线程),其他线程都是在后台配合。

JavaScript Event Loop相关原理解析

JavaScript为什么要采用单线程,而不是多线程?

不想让浏览器变得复杂(避免复杂性),因为多线程需要共享资源、且可能修改彼此运行的结果。

该模式会导致的问题?

如果单个任务耗时长,会拖延整个程序的执行,可能导致浏览器无响应(假死)

JavaScript是如何解决这个问题的?

因为单线程的原因,CPU很多时候都闲着的,并且因为IO操作(输入输出)很慢(比如Ajax操作从网络读取数据),这时CPU可以完全不管IO操作,挂起等待中的任务,先运行排在后面的任务。等到IO操作返回了结果,再回过头,把挂起的任务继续执行下去。这种机制就是JavaScript内部采用的“事件循环”机制(Event Loop)

2.同步任务和异步任务

程序里面所有的任务,可以分成两类:同步任务(synchronous)和异步任务(asynchronous)

同步任务:没有被引擎挂起、在主线程上排队执行的任务。只有前一个任务执行完毕,才能执行后一个任务。

异步任务:被引擎放一边、不进行主线程、而进入任务队列的任务。只有引擎认为某个异步任务可以执行了(比如Ajax操作从服务器得到了结果),那么该任务(通过回调函数的形式)才能进入主线程执行。排在异步任务后面的代码,不用等到异步任务结束就会马上运行,也就是说,异步任务不具有“堵塞”效应

3.任务队列和事件循环

JavaScript运行时,除了一个正在运行的主线程(又称为“调用栈(call stack)”),引擎还提供了一个任务队列(task queue),里面是各种需要处理当前程序处理的异步任务。(实际上,根据异步任务的类型,存在多个任务队列,后面再详讲)

JavaScript Event Loop相关原理解析

1.主线程会去执行所有的同步任务。

2.等到同步任务全部执行完,查看任务队列中的异步任务,将满足条件的重新进入主线程开始执行,这时候就变成同步任务。

3.等任务执行完,下一个异步任务再进入主线程开始执行。

4.引擎不停检查(“事件循环”),一旦任务队列清空,程序就结束执行。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquery validation插件表单验证的一个例子
Mar 03 Javascript
javascript 拖动表格行实现代码
May 05 Javascript
js自定义事件及事件交互原理概述(二)
Feb 01 Javascript
Jquery实现弹出层分享微博插件具备动画效果
Apr 03 Javascript
Internet Explorer 11 浏览器介绍:别叫我IE
Sep 28 Javascript
jQuery实现返回顶部效果的方法
May 29 Javascript
基于BootStrap multiselect.js实现的下拉框联动效果
Jul 28 Javascript
JavaScript实现QQ列表展开收缩扩展功能
Oct 30 Javascript
新手入门带你学习JavaScript引擎运行原理
Jun 24 Javascript
layui问题之渲染数据表格时,仅出现10条数据的解决方法
Sep 12 Javascript
微信小程序实现一个简单swiper代码实例
Dec 30 Javascript
Element Steps步骤条的使用方法
Jul 26 Javascript
vue Element左侧无限级菜单实现
Jun 10 #Javascript
详解用js代码触发dom事件的实现方案
Jun 10 #Javascript
Vue中key的作用示例代码详解
Jun 10 #Javascript
使用JavaScript获取扫码枪扫描得到的条形码的思路代码详解
Jun 10 #Javascript
js 获取扫码枪输入数据的方法
Jun 10 #Javascript
使用Vue Composition API写出清晰、可扩展的表单实现
Jun 10 #Javascript
使用 UniApp 实现小程序的微信登录功能
Jun 09 #Javascript
You might like
星际中的相关伤害
2020/03/04 星际争霸
PHPShop存在多个安全漏洞
2006/10/09 PHP
PHP设计模式之责任链模式的深入解析
2013/06/13 PHP
详解WordPress中创建和添加过滤器的相关PHP函数
2015/12/29 PHP
PHP获取昨天、今天及明天日期的方法
2016/02/03 PHP
php模仿qq空间或朋友圈发布动态、评论动态、回复评论、删除动态或评论的功能(中)
2017/06/11 PHP
jquery 入门教程 [翻译] 推荐
2009/08/17 Javascript
js prototype截取字符串函数
2010/04/01 Javascript
基于jQuery的仿flash的广告轮播
2010/11/05 Javascript
jquery隔行换色效果实现方法
2015/01/15 Javascript
JS自动倒计时30秒后按钮才可用(两种场景)
2015/08/31 Javascript
angularjs实现文字上下无缝滚动特效代码
2016/09/04 Javascript
详解javascript立即执行函数表达式IIFE
2017/02/13 Javascript
JavaScript中运算符规则和隐式类型转换示例详解
2017/09/06 Javascript
详解vue-router 路由元信息
2017/09/13 Javascript
如何抽象一个Vue公共组件
2017/10/17 Javascript
JS实现判断图片是否加载完成的方法分析
2018/07/31 Javascript
layui实现点击按钮给table添加一行
2018/08/10 Javascript
vue 微信扫码登录(自定义样式)
2020/01/06 Javascript
Python中List.count()方法的使用教程
2015/05/20 Python
Python简单的制作图片验证码实例
2017/05/31 Python
python实现csv格式文件转为asc格式文件的方法
2018/03/23 Python
Python浮点数四舍五入问题的分析与解决方法
2019/11/19 Python
Django Haystack 全文检索与关键词高亮的实现
2020/02/17 Python
Python安装与卸载流程详细步骤(图解)
2020/02/20 Python
Armor Lux法国官方网站:水手服装、成衣和内衣
2020/05/26 全球购物
税务干部鉴定材料
2014/02/11 职场文书
高中军训的心得体会
2014/09/01 职场文书
数学教师个人总结
2015/02/06 职场文书
2015年中秋节演讲稿
2015/03/20 职场文书
实习单位推荐信
2015/03/27 职场文书
鲁冰花观后感
2015/06/10 职场文书
老干部座谈会主持词
2015/07/03 职场文书
三八节活动简报
2015/07/20 职场文书
Spring Security中用JWT退出登录时遇到的坑
2021/10/16 Java/Android
Java 轮询锁使用时遇到问题
2022/05/11 Java/Android