Javascript系列之javascript机制

参考连接：
这一次，完全弄懂 JavaScript 执行机制
从浏览器多进程到JS单线程，JS运行机制最全面的一次梳理

JavaScript运行

JavaScript引擎是单线程运行的,浏览器不管在何时都只且只有一个线程在运行JavaScript程序.浏览器的内核是多线程的，它们在内核制控下相互配合以保持同步，一个浏览器至少实现三个常驻线程：javascript引擎线程，GUI渲染线程，浏览器事件触发线程。这些异步线程都会产生不一样的异步的事件.

1. javascript引擎是基于事件驱动单线程执行的，JS引擎一直等待着任务队列中任务的到来，而后加以处理，浏览器不管何时都只有一个JS线程在运行JS程序。
2. GUI渲染线程负责渲染浏览器界面，当界面须要重绘（Repaint）或因为某种操做引起回流(reflow)时,该线程就会执行。但须要注意 GUI渲染线程与JS引擎是互斥的，当JS引擎执行时GUI线程会被挂起，GUI更新会被保存在一个队列中等到JS引擎空闲时当即被执行。
3. 事件触发线程，当一个事件被触发时该线程会把事件添加到待处理队列的队尾，等待JS引擎的处理。这些事件可来自JavaScript引擎当前执行的代码块如setTimeOut、也可来自浏览器内核的其余线程如鼠标点击、AJAX异步请求等，但因为JS的单线程关系全部这些事件都得排队等待JS引擎处理。（当线程中没有执行任何同步代码的前提下才会执行异步代码）

JavaScript运行机制

程序中跑两个线程，一个负责程序自己的运行，做为主线程 main thread； 另外一个负责主线程与其余线程的的通讯，被称为“Event Loop 线程" 。每当遇到异步任务，交给 EventLoop 线程，而后本身日后运行，等到主线程运行完后，再去 EventLoop 线程拿结果。

1）全部任务都在主线程上执行，造成一个执行栈（execution context stack）。

2）主线程以外，还存在一个"任务队列"（task queue）。系统把异步任务放到"任务队列"之中，而后继续执行后续的任务。

3）一旦"执行栈"中的全部任务执行完毕，系统就会读取"任务队列"。若是这个时候，异步任务已经结束了等待状态，就会从"任务队列"进入执行栈，恢复执行。

4）主线程不断重复上面的第三步。

"回调函数"（callback），就是那些会被主线程挂起来的代码。异步任务必须指定回调函数，当异步任务从"任务队列"回到执行栈，回调函数就会执行。"任务队列"是一个先进先出的数据结构，排在前面的事件，优先返回主线程。主线程的读取过程基本上是自动的，只要执行栈一清空，"任务队列"上第一位的事件就自动返回主线程。

Event Loop（事件循环)

主线程从"任务队列"中读取事件，这个过程是循环不断的，因此整个的这种运行机制又称为Event Loop。
Event Loop 是一个很重要的概念，指的是计算机系统的一种运行机制。JavaScript语言就采用这种机制，来解决单线程运行带来的一些问题。

javascript是单线程的，这个线程中拥有惟一的一个事件循环。
JavaScript代码的执行过程当中，除了依靠函数调用栈来搞定函数的执行顺序外，还依靠任务队列(task queue)来搞定另一些代码的执行。
一个线程中，事件循环是惟一的，可是任务队列能够拥有多个。

异步任务：macrotask与microtask

运行机制以下：

• 执行一个宏任务（栈中没有就从事件队列中获取）
• 执行过程当中若是遇到微任务，就将它添加到微任务的任务队列中
• 宏任务执行完毕后，当即执行当前微任务队列中的全部微任务（依次执行）

Tasks, microtasks, queues and schedules

异步setTimeout & setInterval

概念

setTimeout：在指定的毫秒数后，将定时任务处理的函数添加到执行队列的队尾。
setInterval：按照指定的周期(以毫秒数计时)，将定时任务处理函数添加到执行队列的队尾。

从主线程的角度看，一个异步过程包括下面两个要素：

• 发起函数(或叫注册函数)A
• 回调函数callbackFn

它们都是在主线程上调用的，其中注册函数用来发起异步过程，回调函数用来处理结果。

例如setTimeout(fn, 1000)，其中的setTimeout就是异步过程的发起函数，fn是回调函数。用一句话归纳：工做线程将消息放到消息队列，主线程经过事件循环过程去取消息。

• 消息队列：消息队列是一个先进先出的队列，它里面存放着各类消息。
• 事件循环：事件循环是指主线程重复从消息队列中取消息、执行的过程。