JavaScript調(diào)用棧

lushan 發(fā)布于2019-08-26 10:19 / 761人閱讀

摘要：調(diào)用棧是一種棧結(jié)構(gòu)它用來存儲計算機(jī)程序執(zhí)行時候其活躍子程序的信息。調(diào)用棧是解析器的一種機(jī)制。那是如何處理處理函數(shù)的調(diào)用關(guān)系的答案是調(diào)用棧。主線程之外存在一個任務(wù)隊列異步任務(wù)有了運(yùn)行結(jié)果會在任務(wù)隊列之中放置一個任務(wù)。

1：基本概念

棧(stack)：用來保存簡單的數(shù)據(jù)字段。

堆(heap)：用來保存棧中簡單的數(shù)據(jù)字段對指針的引用。

隊列：是一種先進(jìn)先出的線性數(shù)據(jù)結(jié)構(gòu)。

函數(shù)的調(diào)用的進(jìn)棧和出棧的順序，遵循先進(jìn)后出的原則。

空間分配：?堆：一般由程序員釋放，如果程序員不釋放就會在結(jié)束時由OS回收；
棧：一般由操作系統(tǒng)自動分配釋放。

緩存方式：堆：存放在二級緩存中，生命周期一般是由虛擬機(jī)的垃圾回收算法決定的；
棧：存放在一級緩存中，被調(diào)用時處于存儲空間，調(diào)用完立即釋放。

操作數(shù)據(jù)：堆棧（先進(jìn)后出），隊列（先進(jìn)先出）。

調(diào)用棧是一種棧結(jié)構(gòu),它用來存儲計算機(jī)程序執(zhí)行時候其活躍子程序的信息。它是一種LIFO的數(shù)據(jù)結(jié)構(gòu)，將記錄代碼運(yùn)行時的執(zhí)行上下文。當(dāng)遇到某個函數(shù)的調(diào)用語句時，它將會記錄當(dāng)前的執(zhí)行上下文，將函數(shù)入棧，并為其創(chuàng)建一個新的執(zhí)行上下文。（比如什么函數(shù)正在執(zhí)行，什么函數(shù)正在被這個函數(shù)調(diào)用等等信息）。

調(diào)用棧是解析器的一種機(jī)制。

javascript是一門單線程語言，主線程在同一時間只能處理一件事。那javascript是如何處理處理函數(shù)的調(diào)用關(guān)系的？

答案是——調(diào)用棧。

2：Event Loop（事件循環(huán)）

JavaScript是一個單線程，它執(zhí)行的所有代碼都放在下面這個Call Stack里面，當(dāng)Call Stack執(zhí)行完畢之后，就會再右側(cè)的隊列里面找任務(wù)，如果有微任務(wù)，就會先執(zhí)行微任務(wù)，再去執(zhí)行宏任務(wù)。

圖片描述

事件循環(huán)：就是同步任務(wù)進(jìn)入主線程，異步任務(wù)加入到任務(wù)隊列中。等主線程的任務(wù)執(zhí)行完就去執(zhí)行任務(wù)隊列中的任務(wù)，這個過程會不斷重復(fù)。所有同步任務(wù)都在主線程上執(zhí)行，形成一個執(zhí)行棧。主線程之外, 存在一個任務(wù)隊列(task queue), 異步任務(wù)有了運(yùn)行結(jié)果會在任務(wù)隊列之中放置一個任務(wù)。執(zhí)行棧中的所有同步任務(wù)執(zhí)行完畢后讀取任務(wù)隊列(先讀取微任務(wù)、宏任務(wù))不斷重復(fù)上面的第三步。

js既然是單線程那么肯定是排隊執(zhí)行代碼，怎么去排這個隊就是Event Loop，雖然js是單線程但是瀏覽器不是單線程。

    console.log("script start");
    
    setTimeout(function() {
        console.log("timeout1");
    }, 10);
    
    new Promise(resolve => {
        console.log("promise1");
        resolve();
        setTimeout(() => console.log("timeout2"), 10);
    }).then(function() {
        console.log("then1")
    })
    
    console.log("script end");
    
    //
    * script start
    * promise1
    * script end
    * then1
    * timeout1
    * timeout2

3：宏任務(wù)（Mask-task）

setTimeout

setInterval

I/O

特點(diǎn)：由JavaScript線程外的宿主線程執(zhí)行，比如，定時器觸發(fā)線程setTimeout、setInterval，異步http請求線程。JavaScript線程不空閑宏任務(wù)永遠(yuǎn)沒有執(zhí)行機(jī)會。

    for(let i=0; i<100000000; i++) {}
    
    setTimeout(function() {
        console.log("setTimeout1");
    }, 1000);
    
    setTimeout(function() {
        console.log("setTimeout2");
    }, 2000);

4：微任務(wù)（Mask-task）

promise

特點(diǎn)：由JavaScript線程維護(hù)，它的執(zhí)行時機(jī)是在主線程所有可執(zhí)行代碼執(zhí)行完成后執(zhí)行，瀏覽器渲染DOM前會全部執(zhí)行。