首先了解一些概念：
- 進(jìn)程 & 線程：
- 進(jìn)程：
是系統(tǒng)資源分配和調(diào)度的單元，一個(gè)運(yùn)行著的程序就對應(yīng)了一個(gè)進(jìn)程。一個(gè)進(jìn)程包括了運(yùn)行中的程序和程序所使用到的內(nèi)存和系統(tǒng)資源。
單核CPU在同一時(shí)間內(nèi)只有一個(gè)進(jìn)程在運(yùn)行，但單核CPU也能實(shí)現(xiàn)多任務(wù)同時(shí)運(yùn)行，比如你邊聽網(wǎng)易云音樂的每日推薦歌曲，邊在網(wǎng)易有道云筆記上寫博文。這算是多進(jìn)程，運(yùn)行的機(jī)制就是一會(huì)兒播放一下歌，一會(huì)兒響應(yīng)一下你的打字，但由于CPU切換的速度很快，你根本感覺不到，以至于你認(rèn)為這兩個(gè)進(jìn)程是在同時(shí)運(yùn)行的。進(jìn)程之間是資源隔離的。 - 線程：
是進(jìn)程的執(zhí)行者，一個(gè)進(jìn)程至少會(huì)開啟一個(gè)線程。比如網(wǎng)易云音樂一邊播放音頻，一邊顯示歌詞。多進(jìn)程的運(yùn)行其實(shí)也就是通過進(jìn)程中的線程來執(zhí)行的。一個(gè)進(jìn)程下的線程是共享資源的，多個(gè)線程同時(shí)操作同一資源時(shí)就出現(xiàn)資源爭搶的問題。
- 并行 & 并發(fā)：
- 并行：
指程序的運(yùn)行狀態(tài)，在同一個(gè)時(shí)間內(nèi)有幾件事情并行在處理。由于一個(gè)線程在同一時(shí)間只能處理一件事情，所以并行需要多個(gè)線程在同一時(shí)間執(zhí)行多件事情。 - 并發(fā)：
指程序的設(shè)計(jì)結(jié)構(gòu)，在同一時(shí)間內(nèi)多件事情能被交替地處理。重點(diǎn)是，在某個(gè)時(shí)間內(nèi)只有一件事情在執(zhí)行。比如單核CPU能實(shí)現(xiàn)多任務(wù)運(yùn)行的過程就是并發(fā)的。
- 同步 & 異步
- 同步：
從上往下一步步執(zhí)行代碼，一定要等某一個(gè)任務(wù)執(zhí)行完了，得到結(jié)果，才執(zhí)行下一個(gè)任務(wù)。同步是調(diào)用者主動(dòng)等待調(diào)用的過程。
function taskSync = function(){
return '同步任務(wù)的返回值'
}
var result = taskSync() // 那么 result 就是同步任務(wù)的結(jié)果
otherTask() // 然后執(zhí)行下一個(gè)任務(wù)
- 異步：
程序發(fā)出調(diào)用后，不等當(dāng)前任務(wù)執(zhí)行完，直接執(zhí)行下一個(gè)任務(wù)。當(dāng)前任務(wù)返回的是一個(gè)timer id而不是異步執(zhí)行的結(jié)果。凡是有回調(diào)函數(shù)／setTImeout／setInterval／addEventListener／Ajax請求的場景，都是異步事件。
function taskAsync = function(){
var result = setTimeout(function(){
console.log('異步任務(wù)的結(jié)果')
}, 3000)
return result
}
var result = taskAsync() // result 不是異步任務(wù)的結(jié)果，而是一個(gè) timer id
otherTask() // 立即執(zhí)行其他任務(wù)，不等異步任務(wù)結(jié)束
回調(diào)函數(shù)經(jīng)常用于獲取異步任務(wù)的結(jié)果
function taskAsync = function(callback){
var result = setTimeout(function(){
callback('異步任務(wù)的結(jié)果')
}, 3000)
return result
}
taskAsync(function callback(result){
console.log(result) // 三秒鐘后，這個(gè) callback 函數(shù)會(huì)被執(zhí)行
})
otherTask() // 立即執(zhí)行其他任務(wù)，不等異步任務(wù)結(jié)束
那么為什么需要異步呢？
在執(zhí)行某個(gè)非常耗時(shí)的任務(wù)時(shí)候，同步執(zhí)行的邏輯會(huì)鎖死后面所有的代碼，而有了異步，那么瀏覽器將異步代碼抽離出同步執(zhí)行線程，放入異步中執(zhí)行，首先避免的瀏覽器假死，第二個(gè)就是利用了異步線程加快了整體代碼執(zhí)行速度。
- 阻塞 & 非阻塞
- 阻塞：
指調(diào)用在等待的過程中線程被“掛起”（CPU資源被分配到其他地方去了）。 - 非阻塞：
指等待的過程中CPU資源還在該線程中，線程還能做其他的事情。
瀏覽器擁有哪些線程
一個(gè)瀏覽器通常由以下幾個(gè)常駐的線程：
- 渲染引擎線程：顧名思義，該線程負(fù)責(zé)頁面的渲染
- JS引擎線程：負(fù)責(zé)JS的解析和執(zhí)行
- 定時(shí)觸發(fā)器線程：處理定時(shí)事件，比如setTimeout, setInterval
- 事件觸發(fā)線程：處理DOM事件
- 異步http請求線程：處理http請求
需要注意的是，渲染線程和JS引擎線程是不能同時(shí)進(jìn)行的。渲染線程在執(zhí)行任務(wù)的時(shí)候，JS引擎線程會(huì)被掛起。因?yàn)镴S可以操作DOM，若在渲染中JS處理了DOM，瀏覽器可能就不知所措了。
JavaScript的單線程
JavaScript是一個(gè)單線程語言,瀏覽器只會(huì)分配一個(gè)js引擎線程來解析和執(zhí)行js同步代碼。單線程即任務(wù)是串行的，后一個(gè)任務(wù)需要等待前一個(gè)任務(wù)的執(zhí)行。
- 基于以下原因設(shè)計(jì)者將JavaScript設(shè)計(jì)為單線程
- 假設(shè)兩個(gè)JS線程同時(shí)操作DOM或者爭奪唯一性資源，那么瀏覽器需要引入鎖的概念來決定這兩個(gè)JS的操作有效性，為了避免引入鎖帶來的復(fù)雜性，JS就被設(shè)計(jì)為單線程。
- JS當(dāng)初是以i/o為目標(biāo)而設(shè)計(jì)的語言，所以單線程也是為了避免資源的浪費(fèi)。
參考資料
