zoukankan      html  css  js  c++  java
  • JS的Event Loop

    JavaScript是单线程的,只有一个执行栈,一次只能做一件事。

    在浏览器中,却“好像”可以同时做几件事:点击,发送请求,执行多个函数,解析代码。

    这是因为浏览器实现的Event Loop机制。

    Web API

    setTimeout,ajax,dom操作回调,等等都是浏览器(JS runtime)提供的。setTimeout or http or DOM 这些东西在V8引擎代码中都是找不到的,他们都是浏览器自身部署的

    这些操作不占用js线程,只有在回调函数需要执行时,才会将函数推入js执行栈。

    Event Loop

    在浏览器DOM环境中,至少有一个event loop,“相同域名”的DOM环境至多有一个event loop。

     一个event loop可以有多个task queue,task queue包含多个任务。

     event loop会依次执行队列中的task。

    优先执行macrotask queue的task,若某个task执行完成,会先执行microtask queue的task。

    整个脚本文件本身是一个macrotask,在macrotask队列中。

    名词解释

    JS runtime

    不仅包括js引擎,不同runtime还提供不同的功能。

    比如,浏览器提供dom,ajax请求;node.js runtime提供file system,http服务等。

    JavaScript Engine JS引擎

    解释或者执行JS代码。

    Call Stack 执行栈

    执行栈

    Call frame 

    调用帧

    macrotask queue

    这些会产生macrotask,会被push进到macrotask queue

    setTimeout, setInterval, setImmediate, requestAnimationFrame, I/O, UI rendering

    microtask queue

    这些会产生microtask,会被push进到microtask queue

    process.nextTick, Promises, Object.observe, MutationObserver

    [参考资料]

    强烈推荐这个视频,讲的很清楚 https://www.youtube.com/watch?v=8aGhZQkoFbQ

    https://www.w3.org/TR/html5/webappapis.html#event-loops

    https://developer.mozilla.org/en-US/docs/Web/JavaScript/EventLoop

    https://jakearchibald.com/2015/tasks-microtasks-queues-and-schedules/

    https://stackoverflow.com/a/25933985/7362450

    https://www.zhihu.com/question/36972010/answer/71338002

    https://github.com/ccforward/cc/issues/48

  • 相关阅读:
    停止Java线程,小心interrupt()方法
    Runtime.getRuntime().addShutdownHook(shutdownHook);
    jenkins服务器安装
    nexus私服安装
    黑客渗透测试教程
    python fabric实现远程操作和部署
    牛客网编程练习(华为机试在线训练)-----数字颠倒
    牛客网编程练习(华为机试在线训练)-----字符个数统计
    牛客网编程练习(华为机试在线训练)-----提取不重复的整数
    牛客网编程练习(华为机试在线训练)-----合并表记录
  • 原文地址:https://www.cnblogs.com/oneplace/p/8594630.html
Copyright © 2011-2022 走看看