成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

javasctipt 工作原理之調(diào)用棧

Pines_Cheng / 3386人閱讀

摘要：譯者注翻譯一個對新手比較友好的工作原理解析系列文章注意以下全部是概念經(jīng)驗豐富的老鳥可以離場啦正文從這里開始隨著的流行團隊們正在利用來支持多個級別的技術(shù)棧包括前端后端混合開發(fā)嵌入式設(shè)備以及更多這篇文章旨在成為深入挖掘和實際上他是怎么工作的系列

譯者注

翻譯一個對新手比較友好的 JavaScript 工作原理解析系列文章

注意: 以下全部是概念,經(jīng)驗豐富的老鳥可以離場啦

正文從這里開始

隨著 javascript 的流行,團隊們正在利用javascript來支持多個級別的技術(shù)棧,包括前端,后端,混合開發(fā),嵌入式設(shè)備,以及更多

這篇文章旨在成為深入挖掘JavaScript和實際上他是怎么工作的系列文章中的第一篇:我們通過知道javascript的模塊(Building blocks)和他們?nèi)绾谓M合在一起工作來寫更好的代碼和應(yīng)用.我們還會分享一些我們構(gòu)建sessionStarck(這是一款主打反饋功能的產(chǎn)品)時的經(jīng)驗法則,一款輕量級的javascript應(yīng)用為了保持競爭力,必須時要健壯和高性能.

據(jù)githut stats(這是一個統(tǒng)計網(wǎng)站,根據(jù)gihub的數(shù)據(jù)來進行語言統(tǒng)計)的數(shù)據(jù)來看 , JavaScript 是github 上 活躍庫最多的,和提交數(shù)最多的語言,這讓他不會落后于其他類別.

如果項目變得如此依賴于JavaScript,這就意味著,為了開發(fā)驚艷的軟件(可以理解為程序),開發(fā)者不得不利用這個語言和生態(tài)系統(tǒng)(JavaScript生態(tài))提供的一切,對內(nèi)部的更深入和更深入的了解.

事實證明,有很大一部分的開發(fā)者每天都在使用javascript,但是卻不知道javascript 在底層干了啥(原文很長,其實就是這個意思,英文還真的是...)

Overview

基本上每個人都知道 v8 引擎這個概念了,大多數(shù)人知道javascript 是一個單線程語言 或者是那個使用回調(diào)隊列的語言.

這篇文章,我們將跑通哪些概念的細節(jié)和說明javascript是如何運行的,通過知道這些細節(jié),你能夠正確的使用提供的api書寫更好的,非阻塞的應(yīng)用.

如果你是一個javascript新手,這篇文章能讓你知道為什么javascript對比與其他語言,為什么如此神奇.

如果你是一個有經(jīng)驗的javascript開發(fā)者,我也希望如此,這會給你一些關(guān)于javascript運行時是怎么工作的閃亮的靈感(或者說新的見解).

javascript引擎

google v8 引擎是一個了流行的例子,nodejs 和 chrome 都是使用這個引擎,這里是一個簡單的他看起來是什么的圖

這個引擎看起來像是兩個組件.

memory Heap: 這是內(nèi)存分配的位置

call Stack: 這是你的代碼執(zhí)行時,堆棧幀(starck frame)的位置

運行時

在瀏覽器中有一些api已經(jīng)被幾乎所有的javascript開發(fā)者使用了,例如 setTimeout 這些api,然而,他們不是又引擎提供的.

那么,他們從哪里來的呢?

其實這有點復(fù)雜.

看,我們有引擎,但是其實我們還有很多東西.我們有那些瀏覽器提供的web apis,例如 DOM, AJAX, setTimeout等等.

而且,我們還有流行的事件循環(huán)(even loop)和回調(diào)隊列(callback queue)

調(diào)用棧(回調(diào)隊列跟調(diào)用棧其實意思差不多,不過棧跟隊列是兩種不同的數(shù)據(jù)結(jié)構(gòu))

javascript是一個單線程的編程語言(repeat又repeat,都說幾次了),這意味著他有一個調(diào)用棧,因此,他一次只能做一件事情.

調(diào)用棧是一個記錄了我們在程序中的位置的數(shù)據(jù)結(jié)構(gòu),如果我們跳進一個function,我們把這個函數(shù)放進棧的頂部(棧是一種先進后出的數(shù)據(jù)結(jié)構(gòu)),如果我們從function中return出來,我們就從棧的頂部跳了出來,這就是棧能做的事情.

讓我們來看一個例子:

function multiply(x, y) {
    return x * y;
}
function printSquare(x) {
    var s = multiply(x, x);
    console.log(s);
}
printSquare(5);

當引擎執(zhí)行這段代碼的時候,調(diào)用棧(call stack)是空的,當進入printSquare的時候,棧上添加了一個函數(shù),在printSquare中我們又進入了multiply中,此時棧的頂部又添加了一個函數(shù),當我們從multiply中return的時候,棧就把頂部的函數(shù)彈出,此時我們就回到了printSquare里,然后執(zhí)行完printSquare后引擎自動return undefined 以結(jié)束這個函數(shù)的執(zhí)行.

棧的每一次變化就想下面這樣:


棧中的每一個條目(entry)叫坐堆棧幀(stack frames)上面有提到

這就是一個異常拋出時,棧追蹤是如何被構(gòu)造的(how stack traces are being constructed)---這取決于異常發(fā)生的時候,回調(diào)棧的狀態(tài).(突然跑異常去了,其實是想說明,異常就是通過調(diào)用棧實現(xiàn)的)

function foo() {
    throw new Error("SessionStack will help you resolve crashes :)");
}
function bar() {
    foo();
}
function start() {
    bar();
}
start();

如果這段代碼在chrome執(zhí)行,會產(chǎn)生下邊的棧追蹤(其實就是一個錯誤)

"棧壞了"(blowing the stack) --- 這發(fā)生在當你把棧放滿了的時候(下面還說了一大推,還貼了代碼,其實就是死遞歸)

當引擎執(zhí)行死遞歸的時候,會不停的調(diào)用同一個方法.看起來像下面這樣.

然而,函數(shù)在調(diào)用棧上調(diào)用的數(shù)量超過了調(diào)用棧的實際大小,瀏覽器決定要采取行動了,所以他拋出了一個錯誤,看起來是這樣的

在單線程上運行代碼可以很容易,因為你不用去處理多線程中的復(fù)雜場景,例如,死鎖.

但是,運行在單線程上也有他的限制,由于javascript只有一個調(diào)用棧,若是程序執(zhí)行得很慢怎么辦?

并發(fā)和事件循環(huán)(even loop)

當你有函數(shù)調(diào)用在調(diào)用棧(call stack)里為了一個任務(wù)花費了大額的時間會發(fā)生什么?例如,想象一下,你要在瀏覽器了做一個復(fù)雜的圖片轉(zhuǎn)性(transfromation).

你可能會問--為什么這是一個問題?問題是調(diào)用棧有函數(shù)在運行,瀏覽器就不能做其他的事情,這就造成了阻塞,這意味這瀏覽器不能渲染,它不能運行任何的其他代碼,它卡住了,如果你想你的app 的ui界面流暢,那么這就是一個問題.

然而,這不是唯一的問題,一旦你的瀏覽器在調(diào)用棧開始了很多的任務(wù),這可能會在很長的一段時間內(nèi)失去響應(yīng).而很多的瀏覽器會拋出一個錯誤,然后問你是否要關(guān)閉網(wǎng)頁.

現(xiàn)在,這不是一個最好的用戶體驗,對吧?

那么,我們要如何處理這種需要很長時間執(zhí)行的代碼呢?嗯~,解決辦法就是異步回調(diào)

這會再第二篇文章中詳細說明.

下面開始買他們產(chǎn)品的廣告了,就不翻譯了.

原文第二篇我會盡快翻譯,盡量不拖太久.

寫作新手,還望大家多多關(guān)注,多多點贊.

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.hztianpu.com/yun/96533.html

相關(guān)文章

  • jQuery源碼分析系列之自調(diào)用匿名函數(shù)

    摘要：自調(diào)用匿名函數(shù)打開源碼，首先你會看到這樣的代碼結(jié)構(gòu)這是一個自調(diào)用匿名函數(shù)。這樣子最大程度防止外界的變量定義對內(nèi)部造成影響 自調(diào)用匿名函數(shù) 打開jQuery源碼，首先你會看到這樣的代碼結(jié)構(gòu)： (function(window,undefined){ //jquery code })(window); 這是一個自調(diào)用匿名函數(shù)。在第一個括號內(nèi)，創(chuàng)建一個匿名函數(shù)；第二個括號內(nèi)，立...

    psychola 評論0 收藏0

  • [譯文] JavaScript工作原理：引擎、運行時、調(diào)用棧概述

    摘要：調(diào)用棧是單線程編程語言，意味著它只有單一的調(diào)用棧。調(diào)用棧是一種數(shù)據(jù)結(jié)構(gòu)，基本記錄了程序運行的位置。舉個例子，先來看如下所示的代碼當引擎開始執(zhí)行這段代碼時，調(diào)用棧將是空的。這正是拋出異常時棧追蹤的構(gòu)造過程這基本上就是異常拋出時調(diào)用棧的狀態(tài)。 原文 How JavaScript works: an overview of the engine, the runtime, and the c...

    PAMPANG 評論0 收藏0

  • javascript基礎(chǔ)之判斷變量類型

    摘要：判斷變量類型數(shù)據(jù)類型種操作符可能返回的值如下注意的能力有限，其對于類型返回的都是使用場景區(qū)分對象和原始類型要區(qū)分一種對象類型和另一種對象類型可以使用運算符或?qū)ο髮傩赃\算符用法左邊的運算數(shù)是一個右邊運算數(shù)是對象類的名字或者構(gòu)造函數(shù)返回或如果是 判斷變量類型 javaSctipt數(shù)據(jù)類型7種: Number, String, Boolean, Null, Undefined, Object...

    jsdt 評論0 收藏0

  • 理解Node.js(譯文)

    摘要：譯者覺得作者的比喻很適合初學者理解，特此翻譯。進一步說，回調(diào)觸發(fā)的順序是不能被保證的。所以我不必擔心代碼在同一時間訪問同一個數(shù)據(jù)結(jié)構(gòu)你確實理解了，這就是的單進程事件循環(huán)設(shè)計美麗的地方。 前言 總括 ：這篇文章十分生動形象的的介紹了Node，滿足了讀者想去了解Node的需求。作者是Node的第一批貢獻者之一，德國前端大神。譯者覺得作者的比喻很適合初學者理解Node，特此翻譯。 譯者 ：原...

    SegmentFault 評論0 收藏0

  • JavaScript深入之執(zhí)行上下文棧

    摘要：深入系列第三篇，講解執(zhí)行上下文棧的是如何執(zhí)行的，也回答了第二篇中的略難的思考題。 JavaScript深入系列第三篇，講解執(zhí)行上下文棧的是如何執(zhí)行的，也回答了第二篇中的略難的思考題。 順序執(zhí)行？ 如果要問到 JavaScript 代碼執(zhí)行順序的話，想必寫過 JavaScript 的開發(fā)者都會有個直觀的印象，那就是順序執(zhí)行，畢竟： var foo = function () { ...

    codecraft 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<