关于javascript单线程及异步的学习笔记
2018-01-16 15:45
281 查看
单线程是JavaScript的一大特性。
JavaScript不像其他语言比如Java一样多线程,就不必去考虑线程同步的问题。
JavaScript是浏览器用来与用户进行交互、进行DOM操作的,这也使得了它必须是单线程这一特性。比如你去修改一个元素的DOM,同时又去删除这个元素,那么浏览器应该听谁的?
在JavaScript中任务有两种,一种是同步任务,一种是异步任务。
同步任务:各个任务按照文档定义的顺序一一推入"执行栈"中,当前一个任务执行完毕,才会开始执行下一个任务。
异步任务:各个任务推入"任务队列"中,只有在当前的所有同步任务执行完毕,才会将队列中的任务"出队"执行。(注:这里的异步任务并不一定是按照文档定义的顺序推入队列中)
当然了,这时候你会疑惑"任务队列是什么?异步任务通常包括哪些?"
任务队列(event loop):你可理解为用于存放事件的队列,当执行一个异步任务时,就相当于执行任务的回调函数。
通常io(ajax获取服务器数据)、用户/浏览器自执行事件(onclick、onload、onkeyup等等)以及定时器(setTimeout、setInterval)都可以算作异步操作。
我所知道的有这些,如果有其它的事件是异步的,欢迎大大补充。
先来看一段代码来理解一下
输出结果: 1->3->4->2.
分析:
1. 两个console.log()都是同步,按照文档的顺序将它们推入"执行栈"中。
2. 执行栈中的同步任务执行完毕。
3. 将两个异步任务(定时器)按照第二个参数(延迟执行的时间)顺序推入"任务队列"中。
4. 一一执行异步任务。
那么在来看你这段代码。
分析:
1. 先执行同步code1->同步code2。
2. 此时while(true){},进入死循环,以后的代码都不会执行。
JavaScript不像其他语言比如Java一样多线程,就不必去考虑线程同步的问题。
JavaScript是浏览器用来与用户进行交互、进行DOM操作的,这也使得了它必须是单线程这一特性。比如你去修改一个元素的DOM,同时又去删除这个元素,那么浏览器应该听谁的?
在JavaScript中任务有两种,一种是同步任务,一种是异步任务。
同步任务:各个任务按照文档定义的顺序一一推入"执行栈"中,当前一个任务执行完毕,才会开始执行下一个任务。
异步任务:各个任务推入"任务队列"中,只有在当前的所有同步任务执行完毕,才会将队列中的任务"出队"执行。(注:这里的异步任务并不一定是按照文档定义的顺序推入队列中)
//只有用户触发点击事件才会被推入队列中(如果点击时间小于定时器指定的时间,则先于定时器推入,否则反之) document.querySelector("#box").onclick = function(){ console.log("click"); }; //第一个推入队列中 setTimeout(function(){ console.log("1"); },0); //第三个推入队列中 setTimeout(function(){ console.log("2"); },1000); //第二个推入队列中 setTimeout(function(){ console.log("3"); },0);
当然了,这时候你会疑惑"任务队列是什么?异步任务通常包括哪些?"
任务队列(event loop):你可理解为用于存放事件的队列,当执行一个异步任务时,就相当于执行任务的回调函数。
通常io(ajax获取服务器数据)、用户/浏览器自执行事件(onclick、onload、onkeyup等等)以及定时器(setTimeout、setInterval)都可以算作异步操作。
我所知道的有这些,如果有其它的事件是异步的,欢迎大大补充。
先来看一段代码来理解一下
console.log("1"); setTimeout(function(){ console.log("2"); },1000); console.log("3"); setTimeout(function(){ console.log("4"); },0);
输出结果: 1->3->4->2.
分析:
1. 两个console.log()都是同步,按照文档的顺序将它们推入"执行栈"中。
2. 执行栈中的同步任务执行完毕。
3. 将两个异步任务(定时器)按照第二个参数(延迟执行的时间)顺序推入"任务队列"中。
4. 一一执行异步任务。
那么在来看你这段代码。
//同步code1 var t = true; //异步code2 window.setTimeout(function (){ t = false; },1000); //同步code2 while (t){} //同步code3 alert('end');
分析:
1. 先执行同步code1->同步code2。
2. 此时while(true){},进入死循环,以后的代码都不会执行。
相关文章推荐
- 关于安卓异步加载Asynctask的学习笔记
- iOS学习笔记6-关于NSNotificationCenter及同步异步
- iOS学习笔记---利用NSThread实现异步更新UI和下载图片
- Excel学习笔记一关于色彩
- 关于Get和Post的学习笔记(五)
- 关于asp.net 2.0 入门学习之“GlobalResources与Callback问题”的笔记
- 关于HTML5的学习笔记1
- 【Oracle学习笔记-3】关于Oracle 10g中各种服务解析
- Libevent学习笔记一:异步IO
- DirectX学习笔记_关于Sprite.Draw2D的说明
- 关于硬盘和windows、Linux硬盘分区的学习笔记
- caffe学习笔记29-关于目标检测
- 关于直播学习笔记-005 nginx-rtmp、sewiseplayer
- 【iOS学习笔记 15-12-3】关于masonry布局中的frame和bounds
- [WCF 学习笔记] 7. 异步调用
- DirectX学习笔记:关于DX Component结构分析
- Swift学习笔记--关于Swift
- flex学习笔记---关于验证
- C# 学习笔记:关于string与stringbuilder的区别
- 关于SQLServer2005的学习笔记——CTE递归和模拟测试数据