建站
咨詢
售后
建站咨詢
新聞中心
來源 | hashnode.com/@ganeshjaiwal
10年積累的成都做網(wǎng)站、成都網(wǎng)站建設(shè)經(jīng)驗(yàn)，可以快速應(yīng)對客戶對網(wǎng)站的新想法和需求。提供各種問題對應(yīng)的解決方案。讓選擇我們的客戶得到更好、更有力的網(wǎng)絡(luò)服務(wù)。我雖然不認(rèn)識你，你也不認(rèn)識我。但先網(wǎng)站設(shè)計(jì)后付款的網(wǎng)站建設(shè)流程，更有淮上免費(fèi)網(wǎng)站建設(shè)讓你可以放心的選擇與我們合作。
譯者 | 鬼哥
您是否知道簡單的JavaScript語句需要大量工作才能完成?
嗯...
所以瀏覽器無法直接理解javascript。
那我們該如何要求瀏覽器做些什么呢?
讓我們從瀏覽器理解的語言開始。
瀏覽器僅理解0和1s語言，即二進(jìn)制/位格式的語句。
我們無法輕松地將整個(gè)JavaScript轉(zhuǎn)換為位。那么，我們現(xiàn)在該怎么辦???
JavaScript引擎：- “嘿，不用擔(dān)心，我可以為您提供JavaScript文件?！?/p>
那么什么是JavaScript引擎?
當(dāng)將JavaScript文件加載到瀏覽器中時(shí)，JavaScript Engine會(huì)從上到下逐行執(zhí)行該文件(異步代碼將是一個(gè)例外，我們將在本系列后面的內(nèi)容中看到異步代碼)。
JavaScript引擎將逐行解析代碼并將該代碼轉(zhuǎn)換為機(jī)器代碼(二進(jìn)制/位格式)。
現(xiàn)在，瀏覽器可以理解該機(jī)器代碼并相應(yīng)地運(yùn)行。
這是一些JS引擎示例。
那么這個(gè)javascript引擎里面是什么?
這是JavaScript引擎的非?；镜囊晥D。
內(nèi)存堆
JavaScript引擎有時(shí)無法在編譯時(shí)分配內(nèi)存，因此在運(yùn)行時(shí)分配的變量將進(jìn)入內(nèi)存堆(內(nèi)存的非結(jié)構(gòu)化區(qū)域)。即使我們退出在堆中分配內(nèi)存的函數(shù)，我們在堆部分中分配的數(shù)據(jù)/對象仍然存在。
在這里，我們面臨一個(gè)主要的內(nèi)存泄漏問題。
那么什么是內(nèi)存泄漏?
內(nèi)存堆的空間有限。如果我們繼續(xù)使用堆空間而不關(guān)心釋放未使用的內(nèi)存。當(dāng)堆中沒有更多可用內(nèi)存時(shí)，這將導(dǎo)致內(nèi)存泄漏問題。
為了解決此問題，javascript引擎引入了垃圾收集器。
什么是垃圾收集器?垃圾回收是內(nèi)存管理的一種形式。就像一個(gè)收集器，它試圖釋放不再使用的對象所占用的內(nèi)存。換句話說，當(dāng)一個(gè)變量失去所有引用時(shí)，垃圾回收將該內(nèi)存標(biāo)記為“無法訪問”并釋放它。
執(zhí)行上下文棧
堆棧是遵循后進(jìn)先出(LIFO)原理的數(shù)據(jù)結(jié)構(gòu)(進(jìn)入堆棧的最后一項(xiàng)將是要從堆棧中刪除的第一項(xiàng))。
ECS存儲所有功能的執(zhí)行上下文。執(zhí)行上下文定義為存儲局部變量，函數(shù)和對象的對象。
簡而言之，每個(gè)功能都被推到袋子的頂部。
JavaScript引擎執(zhí)行此堆棧頂部的功能。
由于JavaScript引擎只有一個(gè)ECS，因此一次只能執(zhí)行一件事情，這是ECS的頂部。這就是使JavaScript單線程的原因。
您一定聽說過堆棧溢出。
這意味著什么?-ECS的空間也有限。因此，如果我們繼續(xù)在堆棧頂部添加功能。在某個(gè)時(shí)候，將沒有更多的空間來添加更多的堆?？蚣堋Ｔ谶@一點(diǎn)上，我們得到一個(gè)堆棧溢出錯(cuò)誤。
考慮以下示例。
- function heyJS() {
- console.log("Hello you are awesome!!!!");
- heyJS();
- }
- heyJS();
好吧，這進(jìn)入了無限遞歸，并且我們有一個(gè)堆棧溢出錯(cuò)誤。
因此，正如我所提到的，JavaScript是一種簡單的線程語言，這意味著它只有一個(gè)調(diào)用堆棧廣告，因此一次只能執(zhí)行一個(gè)語句。
等等，我們也聽說過用JavaScript進(jìn)行異步編程。那么，一次只允許一項(xiàng)任務(wù)時(shí)，該如何工作?
這是Web API的和回調(diào)隊(duì)列。
Web API
Web API不是JS引擎的一部分，而是Web瀏覽器提供的JavaScript運(yùn)行時(shí)環(huán)境的一部分。JavaScript只是為我們提供了一種訪問這些API的機(jī)制。由于Web API是特定于瀏覽器的，因此它們可能因?yàn)g覽器而異。在某些情況下，某些Web API可能存在于一個(gè)瀏覽器中，而沒有出現(xiàn)在另一瀏覽器中。
例子：-
- document.getElementById();
- document.addEventListerner();
- setTimeOut();
- setInterval();
- 例：-
- console.log(“First!”);
- setTimeout(() => {
- console.log(“Second!”);
- }, 1000 );
- console.log(“Third!”);
- /*
- OutPut:-
- First
- Third
- Second
- */
很奇怪吧?
“第二”位于setTimeout內(nèi)部，因此將在1秒后執(zhí)行。
幕后到底發(fā)生了什么?
1秒鐘后，WebAPI將得到通知，嘿，您有需要立即執(zhí)行的代碼。WebAPI “哦，這是console.log()，我需要執(zhí)行它，但是我不能直接執(zhí)行它。讓我們將其發(fā)送到Callback Queue” “嘿，這里是回調(diào)的Queue，請將其添加到列表中并執(zhí)行。”
回調(diào)隊(duì)列
回調(diào)隊(duì)列或消息隊(duì)列是遵循先進(jìn)先出原則的隊(duì)列數(shù)據(jù)結(jié)構(gòu)(首先插入隊(duì)列的項(xiàng)目將首先從隊(duì)列中刪除)。它存儲所有從事件表移至事件隊(duì)列的消息。每個(gè)消息都有一個(gè)關(guān)聯(lián)的功能。回調(diào)隊(duì)列維護(hù)消息或方法在隊(duì)列中添加的順序。
事件循環(huán)
事件循環(huán)不斷檢查執(zhí)行上下文堆棧是否為空以及事件隊(duì)列中是否有任何消息。僅當(dāng)執(zhí)行上下文堆棧為空時(shí)，才會(huì)將方法從回調(diào)隊(duì)列移至ECS。
回調(diào)隊(duì)列
“嘿，事件循環(huán)請檢查ECS是否為空。我有一些需要推送到ECS中的回調(diào)”。
事件循環(huán)
“隊(duì)列，請給我回調(diào)，ECS現(xiàn)在為空，我將它們壓入堆棧以執(zhí)行它們?！?/p>
最后，最后，我們將獲得輸出。
- // First
- // Third
- // Second
這只是JavaScript引擎工作原理的概述。
JavaScript引擎比我們今天在這里討論的方式復(fù)雜得多。
我將在以后的一些文章中嘗試更深入地了解JavaScript引擎。
在本系列的下一篇文章中，我將解釋Javascript類型，值和變量。
本文轉(zhuǎn)載自微信公眾號「前端人」，可以通過以下二維碼關(guān)注。轉(zhuǎn)載本文請聯(lián)系前端人公眾號。
分享文章：一篇文章深入JavaScript運(yùn)作原理？
分享鏈接：http://www.dlmjj.cn/article/cccccci.html
