最新公告
  • 欢迎您访问爱上源码网,分享精品整站源码,网站模板,游戏源码,APP小程序源码以及视频教程免费下载;服务永无止境!立即加入我们
  • 浏览器的事件循环

    前言

    浏览器事件循环,基础面试中大部分都会问的,本文讲讲这个知识点。

    事件循环机制

    事件循环是负责执行代码、收集和处理事件以及执行队列中的子任务的一套机制。

    在事件循环机制中,使用的栈数据结构便是执行上下文栈,每当有函数被调用时,便会创建相对应的执行上下文并将其入栈;使用到堆数据结构主要是为了表示一个大部分非结构化的内存区域存放对象;使用到的队列数据结构便是任务队列,主要用于存放异步任务。如下图:

    爱上源码网文章浏览器的事件循环的内容插图

    执行上下文栈

    在JavaScript代码运行过程中,会进入到不同的执行环境中,一开始执行时最先进入到全局环境,此时全局上下文首先被创建并入栈,之后当调用函数时则进入相应的函数环境,此时相应函数上下文被创建并入栈,当处于栈顶的执行上下文代码执行完毕后,则会将其出栈。这里说的栈就是执行上下文。

    任务队列

    在事件循环机制中,存在多种任务队列,其分为宏任务队列和微任务队列两种。

    宏观任务

    宏任务包括setTimeout、setInterval、I/O、UI rendering。

    微任务

    微任务包括Promise、Object.observe(已废弃)、MutationObserver(html5新特性)。

    事件循环机制的流程

    1.主线程执行JavaScript整体代码,形成执行上下文栈,当遇到各种任务源时将其所指定的异步任务挂起,接受到响应结果后将异步任务放入对应的任务队列中,直到执行上下文栈只剩全局上下文;

    2.将微任务队列中的所有任务队列按优先级、单个任务队列的异步任务按先进先出的方式入栈并执行,直到清空所有的微任务队列;

    3.将宏任务队列中优先级最高的任务队列中的异步任务按先进先出的方式入栈并执行;

    4.重复第 2 3 步骤,直到清空所有的宏任务队列和微任务队列,全局上下文出栈。

    简单来说,事件循环机制的流程就是,主线程执行JavaScript整体代码后将遇到的各个任务源所指定的任务分发到各个任务队列中,然后微任务队列和宏任务队列交替入栈执行直到清空所有的任务队列,全局上下文出栈。

    最后

    虽然Node.js也有事件循环,可是它和浏览器的事件循环完全不是一个东西。Node.js采用V8作为js的解析引擎,而I/O处理方面使用了自己设计的libuv,libuv是一个基于事件驱动的跨平台抽象层,封装了不同操作系统一些底层特性,对外提供统一的API,事件循环机制也是它里面的实现。这里不展开讲了,想了解的自己去看文档。

    谢谢阅读!

    需要加微信交流,可留言!

    推荐教程:《JS教程》

    以上就是浏览器的事件循环的详细内容,更多请关注爱上源码网其它相关文章!

  • 微信
  • 分享
  • 相关标签:js
  • 本文转载于:掘金社区,如有侵犯,请联系916990011@qq.com删除
    • 上一篇:箭头函数和普通函数区别
    • 下一篇:用Vue+TypeScript项目配置实战

    相关文章

    相关视频

    • Yii 框架怎么引用 JS 和 CSS 文件?
    • PHP 转 JSP 简单转法
    • JS实现斐波那契列数的三种方法
    • JS正则表达式的字符匹配
    • 浏览器的事件循环
    • Node.js 写文件
    • 加入 Vue.js 社区
    • 23.MySQL8新增Json数据类型之修改JSONS数据

    本文有爱上源码下载完入驻作者发布,如果对您版权造成侵害,可以联系本站站长管理进行维权删除,本站收到维权24小时内进行处理,谢谢您关注23ym.cn!
    本站分享大量程序员技术文章以及对编程开发的初级入门教程,包括图文讲解笔记和高清视频下载~

    重要声明:
    1.本站视频教程,软件及网站源码版权均属于原作者所有,您必须在下载后的24个小时之内,从您的电脑中删除!非法商业用途,后果自负!
    2.本站不保证所提供下载资源的安全性和完整性,仅供下载学习之用!如链接失效或资源含外站广告,请联系客服处理!给予奖励!
    3.本站所有资源来源于用户上传和网络,因此不包含技术服务请大家谅解!本站提供有偿服务!如有侵权请联系在线客服!
    4.如您手中有优质资源或教程,可以自助投稿发布,成功分享后有奖励和额外收入!
    5.如您需要正版微擎模块可联系本站客服,我们有价值30w+商业微擎应用出售微擎坑位和招收代理!
    6.400电话/软著/ICP,EDI许可证/商标特价办理中!
    爱上源码下载网 » 浏览器的事件循环

    常见问题FAQ

    从网站下载的源码都有安装教程么?不会安装怎么办?
    本站发布的网站源码和模板资源大部分在压缩包内都有教程,如您不会安装可以联系本站在线技术进行付费安装。
    爱上源码的所有源码都是亲测能正常运行的么?
    本站目前拥有资源10w+,包含整站源码,网站模板,游戏源码,小程序源码,视频教程,破解软件等,每天也在测试更新;因时间和精力有限我们无法对资源进行一一测试,只能保证所分享资源内容无误,希望理解。
    我手中的优质资源可以在你这换钱或者VIP么?
    爱上源码支持投稿,欢迎发布您手中的优质资源进行售卖;本站VIP支持免费获取,目前邀请10人注册爱上源码即可免费获取VIP。
    爱上源码除了资源分享还有其他业务没?
    【价值30W+微擎模块出售正版商业微擎坑位及招收代理,详情咨询本站客服!】我们团队目前运营并推广几套商业化saas智能小程序系统能满足大部分小程序开发需求,并由SaaS和独立部署版商城小程序系统;另外销售400电话,各种ICP/EDI资质证书办理,软著和商标注册服务等。

    发表评论

    • 27会员总数(位)
    • 35644资源总数(个)
    • 0本周发布(个)
    • 0 今日发布(个)
    • 489稳定运行(天)

    提供最优质的资源集合

    开通VIP 源码下载