淺談JavaScript代碼預解析 + 示例詳解

sunnyxd 發布于2019-08-23 15:04 / 3376人閱讀

摘要：知識點聲明的變量在預解析的時候只執行聲明，不會執行定義，默認值是。聲明的函數在預解析的時候會提前聲明并且會同時定義。

知識點

var 聲明的變量在預解析的時候只執行聲明，不會執行定義，默認值是 undefined。

function 聲明的函數在預解析的時候會提前聲明并且會同時定義。

變量名重復聲明無效

預解析過得代碼不會再執行階段執行

示例一

console.log(a);  // 打印函數a函數體（function a() { console.log("a") }）

var a = 10;

console.log(a);  // 10

function a() { console.log("a") }

console.log(a);  // 10

預解析過程

首先預解析到有變量 a 存在，因此記錄下 a 這個名字，和其值 undefined

接著預解析到有函數 a 聲明，記錄下函數名 a

但是發現已經記錄了一個 a ，因此該操作無效，將函數體與 a 這個名字相關聯

解析完畢

預解析過程代碼

a = undefined

a = function () { console.log("a") }

預解析結果

a = function () { console.log("a") }

執行過程

打印變量 a 的值 function a() { console.log("a") }

變量 a 賦值為10，將原來關聯的函數覆蓋

打印變量 a 的值 10

執行完畢

執行過程代碼

console.log(a)

a = 10

console.log(a)

示例二

console.log(fn)  // 函數fn函數體（function fn() { console.log(2) }）

function fn() { console.log(1) }

console.log(fn)  // 函數fn函數體（function fn() { console.log(2) }）

var fn = 10    

console.log(fn)  // 10

function fn() { console.log(2) }   

console.log(fn)  // 10

預解析過程

首先預解析到有函數 fn 聲明，因此記錄 fn 這個名字，并關聯其函數體

接著預解析到變量 fn 聲明，記錄下變量名 fn

但是發現已經記錄了一個 fn ，因此該操作無效

接著預解析到有函數 fn 聲明，因此記錄 fn 這個名字

但是發現已經記錄了一個 fn ，因此該操作無效，接著關聯其函數體

解析完畢

預解析過程代碼

fn = function () { console.log(1) }

fn = function () { console.log(2) }

預解析結果

fn = function () { console.log(2) }

執行過程

打印變量 fn 的值 function fn() { console.log(2) }

變量 fn 賦值為10，將原來關聯的函數覆蓋

打印變量 fn 的值 10

執行完畢

執行過程代碼

console.log(fn)

fn = 10

console.log(fn)

云服務器 GPU云服務器淺談javascript 預解析 var預解析 javascript示例

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/101470.html

2017文章總結

摘要：歡迎來我的個人站點性能優化其他優化瀏覽器關鍵渲染路徑開啟性能優化之旅高性能滾動及頁面渲染優化理論寫法對壓縮率的影響唯快不破應用的個優化步驟進階鵝廠大神用直出實現網頁瞬開緩存網頁性能管理詳解寫給后端程序員的緩存原理介紹年底補課緩存機制優化動歡迎來我的個人站點性能優化其他優化瀏覽器關鍵渲染路徑 - 開啟性能優化之旅高性能滾動 scroll 及頁面渲染優化理論 | HTML寫法...

dailybird 2019-08-01 18:28 評論0 收藏0
2017文章總結

摘要：歡迎來我的個人站點性能優化其他優化瀏覽器關鍵渲染路徑開啟性能優化之旅高性能滾動及頁面渲染優化理論寫法對壓縮率的影響唯快不破應用的個優化步驟進階鵝廠大神用直出實現網頁瞬開緩存網頁性能管理詳解寫給后端程序員的緩存原理介紹年底補課緩存機制優化動歡迎來我的個人站點性能優化其他優化瀏覽器關鍵渲染路徑 - 開啟性能優化之旅高性能滾動 scroll 及頁面渲染優化理論 | HTML寫法...

hellowoody 2019-08-22 14:02 評論0 收藏0
2017文章總結

摘要：歡迎來我的個人站點性能優化其他優化瀏覽器關鍵渲染路徑開啟性能優化之旅高性能滾動及頁面渲染優化理論寫法對壓縮率的影響唯快不破應用的個優化步驟進階鵝廠大神用直出實現網頁瞬開緩存網頁性能管理詳解寫給后端程序員的緩存原理介紹年底補課緩存機制優化動歡迎來我的個人站點性能優化其他優化瀏覽器關鍵渲染路徑 - 開啟性能優化之旅高性能滾動 scroll 及頁面渲染優化理論 | HTML寫法...

wwolf 2019-08-29 14:21 評論0 收藏0
淺談JavaScript作用域

摘要：我們在面試時，總會碰到一些奇奇怪怪的關于作用域的面試題，其實弄清楚原理，萬變不離其宗，大部分的面試題都可以得姐。 showImg(https://segmentfault.com/img/bV7Cri?w=1563&h=879); 我們在面試時，總會碰到一些奇奇怪怪的關于作用域的面試題，其實弄清楚原理，萬變不離其宗，大部分的面試題都可以得 ‘姐’。所以，今天我們來談談 JavaS...

figofuture 2019-08-22 16:00 評論0 收藏0
淺談不同環境下的JavaScript執行機制 + 示例詳解

摘要：如果沒有其他異步任務要處理比如到期的定時器，會一直停留在這個階段，等待請求返回結果。執行的執行事件關閉請求的，例如事件循環的每一次循環都需要依次經過上述的階段。因此，才會早于執行。 showImg(https://segmentfault.com/img/bVbnY76); 概念同步任務（Synchronous）在主線程上排隊執行的任務，只有前一個任務執行完畢，才能執行后一個任務 ...

wanghui 2019-08-23 15:04 評論0 收藏0