JavaScript 异步机制
来源:互联网 发布:js字符串包含某个字符 编辑:程序博客网 时间:2024/05/29 13:58
先看两个js代码片段
for (var i = 1; i <= 5; i++) { setTimeout(function(){ console.log(i); }, 0);}
结果: 输出 5 次 6
var start = new Date;setTimeout(function(){ var end = new Date; console.log('Time elapsed:', end - start, 'ms');}, 500);while (new Date - start < 1000) {};
结果:Time elapsed 1020ms (不同的机器,数值会有不同,不过都会稍微大于1000)
之所以出现上面的结果,就是由于 setTimeout异步执行的结果,js具体的异步机制如下图所示:
异步执行是 javascript 最重要的一个特性,它的原理: js执行引擎只有一个主线程执行代码逻辑,遇到需要异步执行的任务代码,会将其添加事件队列中。当主线程空闲时,轮询事件队列中可以执行的任务,将其放到主线程进行执行,以此类推,直到事件队列中无可执行的任务。
JS引擎只是执行事件队列中的异步代码,但事件队列中的信息来源并不是JS引擎,而是由浏览器中的其他相关线程产生的,如下图所示:
以 http 传输线程为例:
最常见的就是 js 代码发出 ajax 请求,然后就是交给浏览器的http线程去处理了,当后端有数据返回时,http 线程在事件队列中生成一个数据已ready好的事件,等待 JS 主线程空闲时执行。
再比如,我们常见的click,mouse事件,都是GUI 事件触发线程生成的。当用户点击页面时,GUI 事件触发线程就会在事件队列中生成一个click事件,等待 JS 主线程空闲时执行。
0 0
- javascript同步异步机制
- JavaScript 异步机制
- Javascript运行环境异步机制
- 理解javascript异步机制(setTimeout )
- JavaScript异步模块加载机制(AMD)
- JavaScript编程中的同步与异步机制
- JavaScript单线程和异步机制
- JavaScript单线程和异步机制
- 深入理解JavaScript编程中的同步与异步机制
- JavaScript异步函数处理工作机制(setTimeout, setInterval)
- 深入理解JavaScript编程中的同步与异步机制
- 深入理解JavaScript编程中的同步与异步机制
- 深入理解JavaScript编程中的同步与异步机制
- 深入理解JavaScript的执行机制(同步和异步)
- JavaScript的单线程执行及其异步机制矛盾否?
- 异步机制
- JavaScript异步
- javascript 异步编程javascript
- 升级gradle版本之后小米手机调试安装失败
- Spring(五、AOP面向切面编程)
- PAT算法笔记(十六)————组个最小数
- SBULL块设备驱动程序分析
- 休闲时光的小代码-----用div格式制作田字格
- JavaScript 异步机制
- 查看过程函数包含内容
- 关于稳定安逸的工作环境是否真的好?
- Map总结
- 数学问题--PAT.B1003. 我要通过
- UIWebview交互之自定义传值跳转
- 关于androidstudio工程C代码跳转问题
- SpringBoot整合velocity
- qt学习(三):使用qt设计器来设计