【前端--JavaScript】知識點（一）——先有雞（賦值）仍是先有蛋（聲明）| 8月更文挑戰

在一個陽光明媚的早晨，Y同窗拿着手裏的早餐——雞蛋不由想起一個問題，先有雞仍是先有蛋呢？因而和C同窗討論起來這個問題，雙方各執一詞。這時候W同窗過來講：不如以最近學的JavaScript代碼中變量的聲明和賦值問題一決勝負吧！

Y方觀點：先有雞（賦值）纔有蛋（聲明） Vs C方觀點：先有蛋（聲明）纔有雞（賦值）

Y同窗隨手敲了下面的代碼：

a = 2;
var a;
console.log(a);
複製代碼

猜猜console.log會輸出什麼呢？

Y同窗：這裏輸出的是undefined，JavaScript代碼在執行上是按照由上到下一行一行去執行的，天然而然var a;從新把a賦值了，所以會輸出undefined。

C同窗：我認爲會輸出2，由於var會進行變量提高，由於在代碼執行前是要預編譯的。

Y同窗：我不聽我不聽，拿代碼來講服我。

C同窗：那你看這段代碼會輸出什麼呢？

console.log(a);
var a = 2;
複製代碼

Y同窗：你先說吧，我思考下（內心偷偷想，既然你說了var會變量提高，那必定輸出2了，哈哈哈）

這時候有同窗看到了，直接說，在嚴格模式下，變量a沒有先進行聲明，所以會拋出ReferenceRrror異常。

C同窗：我認爲會輸出undefined。（暗自竊喜，我贏定了...）

Y同窗：你剛剛不是說var能夠變量提高，怎麼如今反悔了（噘嘴）？

W同窗：那我們就一塊兒來看看是怎麼回事吧！

同窗們拿着瓜子搬好板凳。

小黑板：首先咱們得知道JavaScript事實上是一門編譯語言，它的編譯原理和傳統的編譯語言很是類似。在傳統的編譯語言的流程中，程序中的一段源代碼在執行前會經歷三個步驟：

1. 分詞/詞法分析
2. 解析/語法分析
3. 代碼生成

（具體解釋下回分解，本次直接對題進行分析）——（瓜子不夠了）

在咱們看到var a = 2;這句代碼中，可能會認爲這是一個聲明，但JavaScript實際上會解析爲兩句代碼var a; a = 2;第一句是在編譯階段進行的，第二句會原地等待執行階段的到來。Y同窗寫的代碼實質上是這樣的：

var a;
a = 2;
console.log(a);
複製代碼

一樣C同窗的第二段代碼實質上是這樣的：

var a;
console.log(a); 
a = 2;
複製代碼

在這裏就發生了變量提高，對於變量而言，那就是先有聲明纔有賦值。（提高的定義：不管做用域中的聲明出如今什麼地方，都將在代碼自己被執行前首先進行處理，能夠將這個過程形象地想象成全部的聲明（變量和函數）都會被「移動」到各自做用域的最頂端，這個過程被稱爲提高。）

C同窗：那就是先有蛋纔有雞了，哈哈哈。

W同窗：敲了敲黑板，平時咱們在寫代碼的過程當中，要注意的是：

• 只有聲明自己纔會被提高，賦值以及其餘邏輯會留在原地，若是提高改變了代碼執行的順序，會形成嚴重的破壞；

• 並且函數聲明也會被提高，重點是函數會首先被提高，而後纔是變量。

• 在聲明時注意避免重複聲明，特別是普通的var聲明和函數聲明混合在一塊兒的時候，不然你們就是上班寫bug，下班改bug。

本次battle C同窗得到勝利，獎勵蜜雪冰城一杯（撒花~）。