16、JS執行機制
以下代碼執行的結果是什么？
console.log(1);
setTimeout(function () {
console.log(3);
}, 1000);
console.log(2);
以下代碼執行的結果是什么？
console.log(1);
setTimeout(function () {
console.log(3);
}, 0);
console.log(2);
1. JS 是單執行緒
單執行緒就意味著，所有任務需要排隊，前一個任務結束，才會執行后一個任務，如果前一個任務耗時很長，后一個任務就不得不一直等著，
這樣所導致的問題是： 如果 JS 執行的時間過長，這樣就會造成頁面的渲染不連貫，導致頁面渲染加載阻塞的感覺，
2. 同步任務和異步任務
? 單執行緒導致的問題就是后面的任務等待前面任務完成，如果前面任務很耗時（比如讀取網路資料），后面任務不得不一直等待！！
? 為了解決這個問題，利用多核 CPU 的計算能力，HTML5 提出 Web Worker 標準，允許 JavaScript 腳本創建多個執行緒，但是子執行緒完全受主執行緒控制，于是，JS 中出現了同步任務和異步任務，
同步
? 前一個任務結束后再執行后一個任務，程式的執行順序與任務的排列順序是一致的、同步的，比如做飯的同步做法：我們要燒水煮飯，等水開了（10分鐘之后），再去切菜，炒菜，
異步
? 你在做一件事情時，因為這件事情會花費很長時間，在做這件事的同時，你還可以去處理其他事情，比如做飯的異步做法，我們在燒水的同時，利用這10分鐘，去切菜，炒菜，
JS中所有任務可以分成兩種，一種是同步任務（synchronous），另一種是異步任務（asynchronous）， 同步任務指的是： 在主執行緒上排隊執行的任務，只有前一個任務執行完畢，才能執行后一個任務； 異步任務指的是： 不進入主執行緒、而進入”任務佇列”的任務，當主執行緒中的任務運行完了，才會從”任務佇列”取出異步任務放入主執行緒執行，
3. JS執行機制（事件回圈）
4. 代碼思考題
<script>
// 1. 第一個問題 同步和異步
console.log(1);
setTimeout(function() {
console.log(3);
}, 1000);
console.log(2); // 123
// 2. 第二個問題 同步任務和異步任務執行程序
console.log(1);
setTimeout(function() {
console.log(3);
}, 0);
console.log(2); // 123
// 3. 第三個問題 js執行機制
// 先同步后異步
// 事件回圈
console.log(1);
document.onclick = function() {
console.log('click');
}
console.log(2);
setTimeout(function() {
console.log(3)
}, 3000) // 123
</script>
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/385627.html
標籤：其他