回答侧重点:
1:强调JS是单线程的,诞生就是如此
1:JavaScript语言的一大特点就是单线程,也就是说,同一个时间只能做一件事。
2:作为浏览器脚本语言,JavaScript的主要用途是与用户互动,以及操作DOM。这决定了它只能是单线程,否则会带来很复杂的同步问题。
3:所以,为了避免复杂性,从一诞生,JavaScript就是单线程,这已经成了这门语言的核心特征,将来也不会改变。
2:单线程是如何做到异步操作的呢?——任务队列
1:单线程就意味着,所有任务需要排队,前一个任务结束,才会执行后一个任务。如果前一个任务耗时很长,后一个任务就不得不一直等着。
2:如果排队是因为计算量大,CPU忙不过来,倒也算了,但是很多时候CPU是闲着的,因为IO设备(输入输出设备)很慢(比如Ajax操作从网络读取数据),
不得不等着结果出来,再往下执行。
3:于是,所有任务可以分成两种,一种是同步任务(synchronous),另一种是异步任务(asynchronous)。
4:同步任务指的是,在主线程上排队执行的任务,只有前一个任务执行完毕,才能执行后一个任务;异步任务指的是,不进入主线程、而进入"任务队列"
(task queue)的任务,只有"任务队列"通知主线程,某个异步任务可以执行了,该任务才会进入主线程执行。
js异步执行的机制:

3:事件和回调函数
1:"任务队列"中的事件,除了IO设备的事件以外,还包括一些用户产生的事件(比如鼠标点击、页面滚动等等)。只要指定过回调函数,这些事件
发生时就会进入"任务队列",等待主线程读取。
2:所谓"回调函数"(callback),就是那些会被主线程挂起来的代码。异步任务必须指定回调函数,当主线程开始执行异步任务,就是执行对
应的回调函数。
3:"任务队列"是一个先进先出的数据结构,排在前面的事件,优先被主线程读取。主线程的读取过程基本上是自动的,只要执行栈一清空,"任务队列"上
第一位的事件就自动进入主线程。但是,由于存在后文提到的"定时器"功能,主线程首先要检查一下执行时间,某些事件只有到了规定的时间,才能
返回主线程。
4:Event Loop事件循环
1:主线程从"任务队列"中读取事件,这个过程是循环不断的,所以整个的这种运行机制又称为Event Loop(事件循环)。
2:上图中,主线程运行的时候,产生堆(heap)和栈(stack),栈中的代码调用各种外部API,它们在"任务队列"中加入各种事件(click,load,done)。
3:只要栈中的代码执行完毕,主线程就会去读取"任务队列",依次执行那些事件所对应的回调函数。

本文参考的优质博文连接导航:
http://lynnelv.github.io/js-event-loop-browser
http://www.ruanyifeng.com/blog/2014/10/event-loop.html
5:先同步任务,后异步任务,先微任务,在宏任务!
具体事例请见此文,代码见下:https://blog.csdn.net/czj1049561601/article/details/113811972?spm=1001.2014.3001.5501

setTimeout(() => { // 会立即放入宏列队
console.log('timeout callback1()')
Promise.resolve(3).then(
value => { // 会立即放入微列队
console.log('Promise onResolved3()', value)
}
)
}, 0)
setTimeout(() => { // 会立即放入宏列队
console.log('timeout callback2()')
}, 0)
Promise.resolve(1).then(
value => { // 会立即放入微列队
console.log('Promise onResolved1()', value)
}
)
Promise.resolve(2).then(
value => { // 会立即放入微列队
console.log('Promise onResolved2()', value)
}
)
121

被折叠的 条评论
为什么被折叠?



