JavaScript是一門單執行緒執行的編程語言，也就是說，同一時間只能做一件事，
單執行緒執行任務佇列的問題：
如果
前一個任務非常耗時
，則后續的任務就不得不一直等待，從而導致
程式假死
的問題，
1.同步任務和異步任務
為了防止某個耗時任務導致程式假死的問題，JavaScript 把待執行的任務分為了兩類：
1.同步任務（synchronous）
又叫做非耗時任務，指的是在主執行緒上排隊執行的那些任務，只有前一個任務執行完畢，才能執行后一個任務，
2.異步任務（asynchronous）
又叫做耗時任務，異步任務由 JavaScript 委托給宿主環境進行執行 當異步任務執行完成后，會通知 JavaScript 主執行緒執行異步任務的回呼函式，
2. 同步任務和異步任務的執行程序
1. 同步任務由 JavaScript 主執行緒次序執行
2. 異步任務委托給宿主環境執行
3. 已完成的異步任務對應的回呼函式，會被加入到任務佇列中等待執行
4. JavaScript 主執行緒的執行堆疊被清空后，會讀取任務佇列中的回呼函式，次序執行
5. JavaScript 主執行緒不斷重復上面的第 4步
JavaScript 主執行緒從“任務佇列”中讀取異步 任務的回呼函式，放到執行堆疊中依次執行 ，這個程序是回圈不斷的，所以整個的這種運行機 制又稱為 EventLoop （事件回圈）
案例：判斷輸出順序
import thenFs from 'then-fs'
console.log('a');
thenFs.readFile('1.txt', 'utf-8').then(dataStr => {
console.log('b');
})
setTimeout(() => {
console.log('c');
}, 0)
console.log('d');
正確的輸出結果：ADCB，其中：
A 和 D 屬于
同步任務
，會根據代碼的先后順序
依次被執行
C 和 B 屬于
異步任務
，它們的回呼函式會被加入到任務佇列中，等待主執行緒空閑時再執行
3.1宏任務和微任務
JavaScript 把異步任務又做了進一步的劃分，異步任務又分為兩類，分別是：
① 宏任務
（macrotask）
異步 Ajax 請求、
setTimeout、setInterval、setImmediate、
script（整體代碼）、
I/O操作等
② 微任務
（microtask）
Promise.then、.catch 和 .finally
process.nextTick
MutationObserver等
3.2宏任務和微任務的執行順序
每一個宏任務執行完之后，都會檢查
是否存在待執行的微任務
，
如果有，則執行完所有微任務之后，再繼續執行下一個宏任務，
案例1：
setTimeout(() => {
console.log('1');
})
new Promise(res => {
console.log('2');
res()
}).then(() => {
console.log('3');
})
console.log('4');
正確的輸出順序是：2431
分析：
① 先執行所有的
同步任務 ===>
執行第 6 行、第 12 行代碼
② 再執行
微任務 ===>
執行第 9 行代碼
③ 再執行
下一個宏任務 ===>
執行第 2 行代碼
案例2：
console.log('1');//
setTimeout(() => {
console.log('2');//
new Promise(resolve => {
console.log('3');//
resolve()
}).then(() => {
console.log('4');//
})
})
new Promise(resolve => {
console.log('5');//
resolve()
}).then(() => {
console.log('6');//
})
setTimeout(() => {
console.log('7');//
new Promise(resolve => {
console.log('8');//
resolve()
}).then(() => {
console.log('9');//
})
})
正確的輸出順序是：156234789
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/330346.html
標籤：其他