js单线程阻塞实例
setTimeout(function () { while (true) { } }, 1000);
setTimeout(function () { alert('end 2'); }, 2000);
setTimeout(function () { alert('end 1'); }, 100);
alert('end');
结果是弹出’end’、’end 1’,然后浏览器假死,就是不弹出‘end 2’。

js单线程重点:
JS 是单线程的,但是却能执行异步任务,
这主要是因为 JS 中存在事件循环(Event Loop)和任务队列(Task Queue)。

事件循环:
JS 会创建一个类似于 while (true) 的循环,
每执行一次循环体的过程称之为 Tick。
每次 Tick 的过程就是查看是否有待处理事件,
如果有则取出相关事件及回调函数放入执行栈中由主线程执行。
待处理的事件会存储在一个任务队列中,
也就是每次 Tick 会查看任务队列中是否有需要执行的任务。

任务队列:
异步操作会将相关回调添加到任务队列中。
而不同的异步操作添加到任务队列的时机也不同,如 onclick, setTimeout, ajax 处理的方式都不同,
这些异步操作是由浏览器内核的 webcore 来执行的。
onclick 由浏览器内核的 DOM Binding 模块来处理,
当事件触发的时候,回调函数会立即添加到任务队列中。
setTimeout 会由浏览器内核的 timer 模块来进行延时处理,
当时间到达的时候,才会将回调函数添加到任务队列中。
ajax 则会由浏览器内核的 network 模块来处理,
在网络请求完成返回之后,才将回调添加到任务队列中。

主线程:
JS 只有一个线程,称之为主线程。
而事件循环是主线程中执行栈里的代码执行完毕之后,才开始执行的。
所以,主线程中要执行的代码时间过长,会阻塞事件循环的执行,也就会阻塞异步操作的执行。
只有当主线程中执行栈为空的时候(即同步代码执行完后),才会进行事件循环来观察要执行的事件回调,
当事件循环检测到任务队列中有事件就取出相关回调放入执行栈中由主线程执行。

JS 单线程的更多相关文章

  1. 从浏览器多进程到JS单线程,JS运行机制的一次系统梳理

    前言 见解有限,如有描述不当之处,请帮忙及时指出,如有错误,会及时修正. ----------超长文+多图预警,需要花费不少时间.---------- 如果看完本文后,还对进程线程傻傻分不清,不清楚浏 ...

  2. 从浏览器多进程到JS单线程,JS运行机制最全面的一次梳理

    前言 来源:https://dailc.github.io/2018/01/21/js_singlethread_eventloop.html 见解有限,如有描述不当之处,请帮忙及时指出,如有错误,会 ...

  3. 【本周面试题】第2周 - js单线程和异步相关问题

    硬性知识点考察: 为什么js是单线程的? 因为js设计最初是为了操作dom而生,如果是多线程的,当多个线程同时修改一个dom时就会产生冲突,所以设计成单线程,一次只能做一件事. 既然是单线程为什么要有 ...

  4. 用故事解析setTimeout和setInterval(内含js单线程和任务队列)

    区别: setTimeout(fn,t): 延迟调用,超过了时间就调用回调函数,返回一个id,使用clearTimeout(id)取消执行. 注意:取消了里面的回调函数就不执行了哦,而不是取消的时候就 ...

  5. 关于js单线程(转载)

    进程和线程都是操作系统的概念.进程是应用程序的执行实例,每一个进程都是由私有的虚拟地址空间.代码.数据和其它系统资源所组成:进程在运行过程中能够申请创建和使用系统资源(如独立的内存区域等),这些资源也 ...

  6. 深度理解Node.js单线程模型

    Node.js采用 事件驱动 和 异步I/O 的方式,实现了一个单线程.高并发的运行时环境,而单线程就意味着同一时间只能做一件事,那么Node.js如何利用单线程来实现高并发和异步I/O?本文将围绕这 ...

  7. JS 单线程和事件循环

    Js 是单线程,js代码从上到下依次执行,比如我们写了两个函数,肯定是上面的函数先执行,下面的函数后执行.但是这种单线程有一个非常大的问题,那就是遇到耗时的任务,后面的任务只能等待它执行完,才能进行. ...

  8. JavaScript之JS单线程|事件循环|事件队列|执行栈

    本博文基于知乎"JavaScript作用域问题?"一问,而引起了对JavaScript事件循环和单线程等概念与实践上的研究.深入理解. 一.概念 0.关键词:JavaScript单 ...

  9. 深入浅析Node.js单线程模型

    Node.js采用 事件驱动 和 异步I/O 的方式,实现了一个单线程.高并发的运行时环境,而单线程就意味着同一时间只能做一件事,那么Node.js如何利用单线程来实现高并发和异步I/O?本文将围绕这 ...

随机推荐

  1. python语法_字符串拼接

    +号可以用来做字符串拼接 print("abc"+"efg"+"def") abcefgdef 字符串(str)与数字(int)不能使用+进 ...

  2. 概率DP求解例题

    1,逆推状态:山东省赛2013年I题 Problem I: The number of steps Description Mary stands in a strange maze, the maz ...

  3. ASP.NET MVC中使用FluentValidation验证实体(转载)

    1.FluentValidation介绍 FluentValidation是与ASP.NET DataAnnotataion Attribute验证实体不同的数据验证组件,提供了将实体与验证分离开来的 ...

  4. UCloud首尔机房整体热迁移是这样炼成的

    小结: 1.把两个机房在逻辑上变成一个机房: 2.新老机房的后端服务使用同一套 ZooKeeper,但是配置的却是不同的 IP: 3.UCloud内部服务所使用的数据库服务为MySQL, 内部MySQ ...

  5. Docker入门6------生产力工具rancher

    rancher的安装: https://blog.csdn.net/wh211212/article/details/80932264 安装 一行命令就可以安装 sudo docker run -d ...

  6. windows 2008R2部署网站后出现 ‘PageHandlerFactory-Integrated’ 的解决办法

    原因:运行4.0的网站,需要用aspnet_regiis注册4.0框架,然后用4.0的Class池,就可以运行4.0的web项目了. 解决方法:1.在cmd中切换到4.0所在的目录,命令如下:cd C ...

  7. Error: Cannot find module 'babel-helpers'

    cnpm install babel-core babel-loader babel-plugin-transform-runtime -D cnpm install babel-preset-env ...

  8. DAX/PowerBI系列 - 库存总价值(Inventory Value)

    DAX/PowerBI系列 - 库存总价值(Inventory Value) 欢迎交流与骚扰 难度: ★★☆☆☆(2星) 适用: ★★☆☆☆(2星) 概况: 有多少货(库存)当然重要(对于运营人员), ...

  9. ignore_user_abort(true); set_time_limit(0);程序在本地测试可以一直运行,上传服务器只能运行10-15分钟

    当PHP运行在安全模式下时此函数无效.除了关闭安全模式或者在php.ini程序中修改最大运行时间没有其他办法让此函数运行. php.ini 中缺省的最长执行时间是 30 秒,这是由 php.ini 中 ...

  10. cocos2d-x JS 本地玩家位置跟服务器玩家位置转换相关

    //各种游戏人数情况下的本地位置配置mb.LOCAL_POS_LIST = { 2 : [0, 2], 3 : [0, 1, 3], 4 : [0, 1, 2, 3]}; /*------------ ...