成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

JavaScript是如何工作的：引擎，運行時間以及回調(diào)的概述

he_xd / 2968人閱讀

摘要：是如何工作的引擎，運行時以及調(diào)用棧的概述原文譯者隨著變得越來越流行，團(tuán)隊在多個層級都對它進(jìn)行利用前端，后端，混合應(yīng)用，嵌入式設(shè)備以及更多。這個將會在是如何工作的的第二部分進(jìn)一步解釋。

How JavaScript works: an overview of the engine, the runtime, and the call stack JavaScript是如何工作的：引擎，運行時以及調(diào)用棧的概述 
原文：How JavaScript works: an overview of the engine, the runtime, and the call stack


譯者：neal1991


welcome to star my articles-translator , providing you advanced articles translation. Any suggestion, please issue or contact me


LICENSE: MIT

隨著JavaScript變得越來越流行，團(tuán)隊在多個層級都對它進(jìn)行利用－前端，后端，混合應(yīng)用，嵌入式設(shè)備以及更多。

正如GitHut stats所展示的那樣，JavaScript是Github上面最活躍以及總Push次數(shù)最多的語言。在其它類別中也不會落后太多。

(獲取最新的 GitHub language stats).

如果項目對于JavaScript越來越依賴，這意味著為了構(gòu)建好的軟件開發(fā)者必須利用這個JS提供的一切并且對于生態(tài)系統(tǒng)的內(nèi)部有著更深的理解。

因此，盡管每天有很多開發(fā)者在使用JavaScript，但并不知道內(nèi)部到底發(fā)生了什么。

概覽

幾乎每個人都已經(jīng)聽說過V8引擎的概念，并且很多知道JavaScript是單線程的或者它是使用一個回調(diào)隊列的。

在這篇博文中，我們將會詳細(xì)講述所有概念并且解釋JavaScript是如何真正運行的。在了解這些細(xì)節(jié)之后，你將能夠?qū)懗瞿軌蜻m宜地利用提供的API的更好的，非阻塞的app。

如果對于JvaScript來說還不是很了解，這篇博文將會幫助你理解為什么JavaScript和別的語言相比如此“奇怪”。

如果你是一個有經(jīng)驗的JavaScript開發(fā)者，希望這篇文章能夠讓你對你每天使用的JavaScript Runtime是如何真正工作的。

JavaScript 引擎

最流行的JavaScript引擎的例子之一就是谷歌的V8引擎。比如Chrome以及Node.js內(nèi)部就是使用V8引擎。下面是一個簡單的視圖示例：

引擎主要由兩個部分組成：

內(nèi)存堆——這是內(nèi)存分配發(fā)生的地方

回調(diào)——這是你代碼執(zhí)行時的棧幀。

Runtime

有很多瀏覽器中的API幾乎都被JavaScript開發(fā)者使用過（比如："setTimeout"）。然而這些API并不是由引擎提供的。

那么，它們是從哪來的呢？

事實證明這有一點復(fù)雜。

因此，雖然我們有引擎但實際上是有更多。我們有那些由瀏覽器提供的Web API，像DOM, AJAX, setTimeout以及更多。

接著，我們還有非常流行的事件循環(huán)(event loo)以及回調(diào)隊列(callback queue)。

調(diào)用棧

JavaScript是一種單線程的編程語言，這意味著它只擁有一個多帶帶的調(diào)用棧。因此它一次只能做一件事情。

調(diào)用棧是一種數(shù)據(jù)結(jié)構(gòu)記錄著我們正在程序的什么地方。如果我們步入一個函數(shù)，我們就將這個函數(shù)放在棧的頂部。如果我們從一個函數(shù)返回，我們則是將這個函數(shù)從棧頂彈出。這就是這個棧所做的一切。

讓我們看一個例子。參看如下代碼：

function multiply(x, y) {
    return x * y;
}

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

printSquare(5);

當(dāng)引擎執(zhí)行這段代碼的時候，調(diào)用棧首先將會是空的。然后，將會按照以下步驟進(jìn)行：

調(diào)用棧中的每一項都被稱為棧幀(Stack Frame)。

并且這正是都異常被拋出的時候棧追蹤是如何構(gòu)建的——這基本就是異常發(fā)生時調(diào)用棧的狀態(tài)。請看如下代碼：

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

function bar() {
    foo();
}

function start() {
    bar();
}

start();

如果這段代碼在Chrome中執(zhí)行（假設(shè)代碼是在一個叫做foo.js的文件中），接下來的棧追蹤將會產(chǎn)生：

“爆棧"——當(dāng)你達(dá)到最大調(diào)用棧的大小的時候就會發(fā)生這種情況。并且這種情況很容易產(chǎn)生，特別是你沒有對你的代碼做全面的測試的時候。請看下面的示例代碼：

function foo() {
    foo();
}

foo();

當(dāng)引擎開始執(zhí)行這段代碼的時候，它一開始調(diào)用函數(shù)”foo“。然而，這個函數(shù)遞歸調(diào)用本身并且沒有終止條件。因此在每一個執(zhí)行的步驟中，相同的函數(shù)都會一次又一次地被添加到調(diào)用棧中。看起來就像這樣：

在某個點，然而函數(shù)調(diào)用的數(shù)量就超過調(diào)用棧的實際尺寸，那么瀏覽器就決定采取行動，拋出一個錯誤，看起來是這個樣子的：

在單線程環(huán)境中運行代碼可能相當(dāng)容易因為你不需要處理多線程環(huán)境中復(fù)雜的情形——比如，死鎖。

但是在單線程環(huán)境中也可能遇到種種限制。因為JavaScript具有一個多帶帶的調(diào)用棧，當(dāng)事情變得緩慢的時候到底發(fā)生了什么？

并發(fā)以及事件循環(huán)

當(dāng)你的函數(shù)調(diào)用在調(diào)用棧中花了大量的時間來進(jìn)行到底發(fā)生了什么？比如，想象一下假如你想在瀏覽器中使用JavaScript來做一些復(fù)雜的圖像轉(zhuǎn)換。

你可能會問——為什么這也會是一個問題？問題是盡管調(diào)用棧具有函數(shù)來執(zhí)行，但是瀏覽器實施中不能做任何其他的事——它被阻塞了。這意味著瀏覽器不能渲染，它不能運行其他的代碼，它就是歇菜了。如果你希望你的app能夠具有流暢的UI的時候就會產(chǎn)生問題。

并且這不是唯一的問題。一旦你的瀏覽器開始處理調(diào)用棧中的大量任務(wù)，他將在很長時間內(nèi)都無法響應(yīng)。大多數(shù)瀏覽器通過拋出錯誤來采取行動，詢問你是否想中止網(wǎng)頁。

現(xiàn)在，這并不是一種最好的用戶體驗，是不是？

因此，我們?nèi)绾卧诓蛔枞鸘I并且讓瀏覽器保持響應(yīng)的情況下執(zhí)行大量的代碼？解決方案就是異步回調(diào)。

這個將會在”JavaScript是如何工作的"的第二部分進(jìn)一步解釋。

同時，如果你很難在你的JavaScript重現(xiàn)并且理解問題的時候，可以看看 SessionStack。SessionStack記錄了你的web應(yīng)用中的一切：所有的DOM變化，用戶交互，JavaScript異常，棧追蹤，失敗的網(wǎng)絡(luò)請求以及調(diào)試消息。

使用SessionStack，你可以重現(xiàn)你的web應(yīng)用中的問題就像錄像一樣，并且可以看到用戶交互的一切。

現(xiàn)在有一個免費的計劃能夠允許你可以開始免費試用

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

轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/91787.html

相關(guān)文章

  • 【譯】JavaScript 如何工作：對引擎、運行時、調(diào)用堆棧的概述

    摘要：調(diào)用棧是一種數(shù)據(jù)結(jié)構(gòu)，它記錄了我們在程序中的位置。當(dāng)從這個函數(shù)返回的時候，就會將這個函數(shù)從棧頂彈出，這就是調(diào)用棧做的事情。而且這不是唯一的問題，一旦你的瀏覽器開始處理調(diào)用棧中的眾多任務(wù)，它可能會停止響應(yīng)相當(dāng)長一段時間。 原文地址: https://blog.sessionstack.com... PS: 好久沒寫東西了，最近一直在準(zhǔn)備寫一個自己的博客，最后一些技術(shù)方向已經(jīng)敲定了，又可以...

    Warren 評論0 收藏0

  • JavaScript是如何工作的：引擎，運行時和調(diào)用堆棧的概述！

    摘要：調(diào)用棧是一種單線程編程語言，這意味著它只有一個調(diào)用堆棧。調(diào)用棧是一種數(shù)據(jù)結(jié)構(gòu)，它記錄了我們在程序中的位置。而且這不是唯一的問題，一旦你的瀏覽器開始處理調(diào)用棧中的眾多任務(wù)，它可能會停止響應(yīng)相當(dāng)長一段時間。 本文是旨在深入研究JavaScript及其實際工作原理的系列文章中的第一篇:我們認(rèn)為通過了解JavaScript的構(gòu)建塊以及它們是如何工作的，將能夠編寫更好的代碼和應(yīng)用程序。我們還將分...

    PiscesYE 評論0 收藏0

  • JavaScript如何工作：引擎，運行時和調(diào)用堆棧的概述

    摘要：如果我們進(jìn)入一個函數(shù)，我們在堆棧的頂部。看看下面的代碼當(dāng)引擎開始執(zhí)行此代碼時，調(diào)用堆棧將為空。之后，步驟如下調(diào)用堆棧中的每個條目稱為堆棧幀。這正是拋出異常時構(gòu)造堆棧跟蹤的方式當(dāng)異常發(fā)生時，它基本上是調(diào)用堆棧的狀態(tài)。 隨著JavaScript越來越受歡迎，團(tuán)隊正在利用這個技術(shù)棧在多個層次- 前端，后端，混合應(yīng)用程序，嵌入式設(shè)備等等提供支持。 這篇文章旨在成為系列中第一個旨在深入挖掘Jav...

    wwolf 評論0 收藏0

  • JavaScript 工作原理之一－引擎，運行時，調(diào)用堆棧(譯)

    摘要：本章會對語言引擎，運行時，調(diào)用棧做一個概述。調(diào)用棧只是一個單線程的編程語言，這意味著它只有一個調(diào)用棧。查看如下代碼當(dāng)引擎開始執(zhí)行這段代碼的時候，調(diào)用棧會被清空。之后，產(chǎn)生如下步驟調(diào)用棧中的每個入口被稱為堆棧結(jié)構(gòu)。 原文請查閱這里，本文采用知識共享署名 4.0 國際許可協(xié)議共享，BY Troland。 本系列持續(xù)更新中，Github 地址請查閱這里。 這是 JavaScript 工作原...

    Betta 評論0 收藏0

  • JavaScript 工作原理之一－引擎，運行時，調(diào)用堆棧(譯)

    摘要：本章會對語言引擎，運行時，調(diào)用棧做一個概述。調(diào)用棧只是一個單線程的編程語言，這意味著它只有一個調(diào)用棧。查看如下代碼當(dāng)引擎開始執(zhí)行這段代碼的時候，調(diào)用棧會被清空。之后，產(chǎn)生如下步驟調(diào)用棧中的每個入口被稱為堆棧結(jié)構(gòu)。 原文請查閱這里，本文采用知識共享署名 4.0 國際許可協(xié)議共享，BY Troland。 本系列持續(xù)更新中，Github 地址請查閱這里。 這是 JavaScript 工作原...

    Alex 評論0 收藏0

發(fā)表評論

0條評論

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