JS的本质是单线程的。这点区别于JAVA的两个线程并发

但是,平时的JS,确实是同时运行很多任务,这又是怎么回事????

First,js的代码分为两种。同步代码和异步代码。

console.log(1)
console.log(1)
console.log(1)

这就是典型的同步代码,编写顺序就是执行顺序。

js引擎的主线程负责执行代码,由于只有这样一个线程,执行当然是同步的,即按照顺序来。

另外,还有一个叫做任务队列的东西,所有的异步代码都是从队列当中来。

通过上图我们就可以发现,JS根本不可能同时执行两个任务,本质上还是单线程的。

在JS中,所谓的异步分为三种:

第一,鼠标的键盘事件触发,例如onclick,onkeydown等等

第二,网络的事件触发,例如onload,onerror等等

第三,定时器,例如setTimeout,setInterval

因为这些任务的发生都不是发生在当下,而是过一段事件以后再执行。因此时间不可控。简单的就是说,你不能让因为5秒后要执行一个函数,就让主线程闲置5秒什么都不干吧!所以你只能继续执行后续的同步代码。而当你单击鼠标或滚动窗口时,主线程可能正在执行其他的任务,忙着呢!没有功夫处理,因此,事件触发线程就负责来接收这个事件,并把要执行的任务暂时保存在队列当中。等主线程把手里的同步代码执行完成后,就立刻会向任务队列提取最新的任务。

这也就解释了为什么我们总把JS的异步函数叫做回调了,因为真的不是马上执行,而是回头再调。

我们看一个简单的例子:

setTimeout("console.log(2)",0)
console.log(1)

  反复执行这段代码,都是先打印1,后打印2

因为setTimeout是一个异步的任务,第二参数真正的含义是在0毫秒之后,将代码插入到队列中,而不是在0毫秒之后执行。

当插入任务队列后,主线程会继续执行后续的代码,也就是打印结果1,如果此时的当前的同步代码已经执行完毕,则主线程立刻会从任务队列中取出最新的任务执行。再打印出j结果2。

平时我们使用定时器,时间上往往不准确,就是因为在加入任务队列时。前面可能有很多任务在排队,你明明写了延迟80ms,可是却等了100ms才出现了结果。

同时我们也理解了,为什么setInterval的事件间隔不能设置为0,一般情况下浏览器允许的最小值为16ms,因为如果你设置了0的话,对于浏览器来说,压力简直太大了,定时器触发线程会玩命的往队列中插入任务,而不是完成一个在插入一个。

我们再看一个ajax的例子

var req = new XMLHttpRequest();
req.open("get","http://XXXXXXXXXXX");
req.onload = function(){................}
req.send();

  

这里的send和onload是可以交换顺序的,因为send是一个异步的方法

。。。。。。。。。。未完待续

如何理解JavaScript的单线程的更多相关文章

  1. 深入理解Javascript单线程谈Event Loop

    假如面试回答js的运行机制时,你可能说出这么一段话:"Javascript的事件分同步任务和异步任务,遇到同步任务就放在执行栈中执行,而碰到异步任务就放到任务队列之中,等到执行栈执行完毕之后 ...

  2. 我想这次我真的理解了 JavaScript 的单线程机制

    今天面试的时候被问到一个问题,是关于 JS 异步的.当时我脑海中闪过了一个单线程的概念,但却没有把真正的原理阐述清楚.所以回来特意重新回顾了前面单线程和异步相关的一些知识点. 虽然之前学习的时候也接触 ...

  3. 【前端知识体系-JS相关】深入理解JavaScript异步和单线程

    1. 为什么JavaScript是单线程? JavaScript语言的一大特点就是单线程,也就是说,同一个时间只能做一件事.那么,为什么JavaScript不能有多个线程呢?这样能提高效率啊. Jav ...

  4. 深入理解JavaScript运行机制

    深入理解JavaScript运行机制 前言 本文是写作在给团队新人培训之际,所以其实本文的受众是对JavaScript的运行机制不了解或了解起来有困难的小伙伴.也就是说,其实真正的原理和本文阐述的并不 ...

  5. Javascript是单线程的深入分析

    本来想总结一下的,网上却发现有人已经解释的很清楚了,特转过来. 这也解释了为什么在用自动化测试工具来运行dumrendtree时设定的超时和测试case设定的超时的关联性. 面试的时候发现99%的童鞋 ...

  6. JavaScript可否多线程? 深入理解JavaScript定时机制

    JavaScript的setTimeout与setInterval是两个很容易欺骗别人感情的方法,因为我们开始常常以为调用了就会按既定的方式执行, 我想不少人都深有同感, 例如 setTimeout( ...

  7. 深入理解JavaScript定时机制和定时器注意问题

    容易欺骗别人感情的JavaScript定时器 JavaScript的setTimeout与setInterval是两个很容易欺骗别人感情的方法,因为我们开始常常以为调用了就会按既定的方式执行, 我想不 ...

  8. 理解JavaScript中的事件轮询

    原文:http://www.ruanyifeng.com/blog/2014/10/event-loop.html 为什么JavaScript是单线程 JavaScript语言的一大特点就是单线程,也 ...

  9. 阅读《深入理解JavaScript定时机制》

    鸟哥的这篇<深入理解JavaScript定时机制>从javascript线程角度分析了setTimeout和setInterval两个定时触发器的实现原理. 看完的体验就是主要要记住两点: ...

随机推荐

  1. 网络知识: 物理层PHY 和 网络层MAC

    PHY模块简介 物理层位于OSI最底层,物理层协议定义电气信号.线的状态.时钟要求.数据编码和数据传输用的连接器. 物理层的器件称为PHY. 上图里的灰色方框图里的就是PHY芯片内部模块图. MAC器 ...

  2. [学习笔记]overthewire bandit 通关秘籍

    1.第一关 使用putty等工具连入linux即可,注意port等设置. ls 列目录内文件: cat readme,显示文件内容,即可看到密码. 2.第二关 如何查看文件名为-的文件? cat ./ ...

  3. Hackrank Equal DP

    Christy is interning at HackerRank. One day she has to distribute some chocolates to her colleagues. ...

  4. slf4j的总结

    参考文章 log4j2使用总结 slf4j介绍以及实现原理窥探 使用Slf4j集成Log4j2构建项目日志系统的完美解决方案 slf4j(全称是Simple Loging Facade For Jav ...

  5. The uWSGI project aims at developing a full stack for building hosting services.

    https://github.com/unbit/uwsgi-docs/blob/master/index.rst

  6. 有关 enum的重新理解

    有关enum 的再次理解: 所有的枚举都继承自java.lang.Enum类. 说到底enum也只是一个java类,只不过他有几个特殊的点.   1.enum中的各个实例,就是enum的static实 ...

  7. publish and submit

    http://blog.csdn.net/w_jewelry/article/details/8123639 1.Gerrit里点击“publish and submit”提示如下:Your chan ...

  8. Linux shell 脚本中变量的数学计算【转】

    本文转载自:http://blog.csdn.net/qinghezhen/article/details/9194287 首先从一个例子说起: x=1+1 echo $x 你是不是期待着输出2啊?让 ...

  9. webstorm使用帮助(转自http://my.oschina.net/longteng2013/blog/138010),另外有部分内容摘自其它人博客

    为了更高效的开发代码,这里列出了一些webstorm的快捷键和zencoding 发表于1 年 前(2013-06-17 00:19)   阅读(2101) | 评论(2) 11人收藏此文章, 我要收 ...

  10. JavaScript 图片广告自动与手动的切换

    ​1.代码 <html> <head>   <script type="text/javascript" src="jquery-1.8.j ...