JavaScript Event Loop相关原理解析

 更新时间:2020年06月10日 11:20:30   作者:重科前端小鑫  
这篇文章主要介绍了JavaScript Event Loop相关原理解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

1.单线程模型

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

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

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

该模式会导致的问题?

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

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

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

2.同步任务和异步任务

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

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

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

3.任务队列和事件循环

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

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

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

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

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

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

相关文章

  • Javascript改变CSS样式(局部和全局)

    Javascript改变CSS样式(局部和全局)

    改变CSS样式分为局部和全局,下面为大家介绍下使用Javascript具体的实现,感兴趣的朋友可以参考下
    2013-12-12
  • JS动态遍历json中所有键值对的方法(不知道属性名的情况)

    JS动态遍历json中所有键值对的方法(不知道属性名的情况)

    这篇文章主要介绍了JS动态遍历json中所有键值对的方法,实例分析了针对不知道属性名的情况简单遍历json键值对的操作技巧,需要的朋友可以参考下
    2016-12-12
  • JavaScript 实现生命游戏

    JavaScript 实现生命游戏

    这篇文章主要介绍了JavaScript 实现生命游戏的示例步骤,帮助大家更好的理解和学习使用JavaScript,感兴趣的朋友可以了解下
    2021-04-04
  • swiper移动端轮播插件(触碰图片之后停止轮播)

    swiper移动端轮播插件(触碰图片之后停止轮播)

    这篇文章主要为大家详细介绍了swiper移动端轮播插件,触碰图片之后停止轮播,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-12-12
  • video.js使用改变ui过程

    video.js使用改变ui过程

    这篇文章主要介绍了video.js使用改变ui的过程,非常不错,具有参考借鉴价值,需要的朋友可以参考下
    2017-03-03
  • JavaScript异步编程操作实现介绍

    JavaScript异步编程操作实现介绍

    异步(Asynchronous, async)是与同步(Synchronous, sync)相对的概念。在我们学习的传统单线程编程中,程序的运行是同步的,同步不意味着所有步骤同时运行,而是指步骤在一个控制流序列中按顺序执行,而异步的概念则是不保证同步的概念
    2022-09-09
  • js+canvas实现滑动拼图验证码功能

    js+canvas实现滑动拼图验证码功能

    这篇文章主要介绍了js+canvas实现滑动拼图验证码功能,本文结合实例代码分步骤给大家介绍的非常详细,需要的朋友可以参考下
    2018-03-03
  • js promise 中使用 setTimeout 实现暂停执行的效果

    js promise 中使用 setTimeout 实现暂停执行的效果

    这篇文章主要介绍了js promise 中使用 setTimeout 实现暂停执行的,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
    2023-04-04
  • JS解析XML实例分析

    JS解析XML实例分析

    这篇文章主要介绍了JS解析XML的方法,实例分析了javascript针对IE浏览器与非IE浏览器解析XML文件的技巧,非常具有实用价值,需要的朋友可以参考下
    2015-01-01
  • BootStrap入门学习第一篇

    BootStrap入门学习第一篇

    这篇文章主要为大家详细介绍了BootStrap入门学习第一篇,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-08-08

最新评论