一:同步 & 異步
同步:js是單線程,按照代碼從上到下的順序執行。多個同步任務組成執行的執行棧。比如:
alert(1); // 主線程上執行當前的同步任務 console.log(2);
如果不確定點擊alert彈框的內容,在控制台是看不到打印2出現的。
異步:不用等待當前任務的執行,等待異步任務有了執行結果,會放置一個時間到任務隊列中。等待執行棧中的內容執行完畢就安順序執行任務隊列中的任務。
同步任務、異步任務、執行棧、任務隊列、主線程 個人理解的關系圖如下:

二:宏任務 & 微任務
宏任務:

微任務:

執行順序:同步 -> 異步 -> 宏任務 -> 微任務
有些說法中是 先微任務 -> 宏任務;其實都一樣,看針對那個任務而言。先微任務 ->宏任務, 微任務是本次宏任務中的,而宏任務是下一次的任務。先宏任務->微任務 是先把本次宏任務結束完成,再進行下一次的宏任務中的微任務。
例如:
setTimeout(() => {
console.log('異步1任務time1');
new Promise(function (resolve, reject) {
console.log('異步1宏任務promise');
setTimeout(() => {
console.log('異步1任務time2');
}, 0);
resolve();
}).then(function () {
console.log('異步1微任務then')
})
}, 0);
console.log('主線程宏任務');
setTimeout(() => {
console.log('異步2任務time2');
}, 0);
new Promise(function (resolve, reject) {
console.log('宏任務promise');
// reject();
resolve();
}).then(function () {
console.log('微任務then')
}).catch(function () {
console.log('微任務catch')
})
console.log('主線程宏任務2');
執行結果:

