????關(guān)于變量提升，以前在一些教程和書籍上都聽到過，平時(shí)開發(fā)中也知道有這個(gè)規(guī)律，但是今天突然在一個(gè)公開課中聽到時(shí)，第一反應(yīng)時(shí)一臉懵逼，然后一百度，瞬間覺得好熟悉啊，差點(diǎn)被這個(gè)概念給唬住了，不信我給你看個(gè)栗子，你也會恍然大悟的：

(function(){console.log(v);var v = 'I love you';console.log(v); })() // undefined I love you

????這就是一個(gè)典型的變量提升的例子了，規(guī)則是怎樣的呢，我的理解是在一個(gè)作用域內(nèi)，無論你在哪個(gè)地方聲明的變量都會被提升到頂部，但不會賦值。像本例子中的v就是先被提升到了函數(shù)作用域的頂端，所以實(shí)際運(yùn)行過程是這樣的：

(function(){var v = undefined; console.log(v);v = 'I love you';console.log(v); })() // undefined I love you

????為什么會這樣呢，我參考了別人的解釋是因?yàn)閖s的運(yùn)行機(jī)制：

js自上而下的執(zhí)行過程分為兩個(gè)詞法分析和執(zhí)行兩個(gè)階段：詞法分析主要包括：分析形參、分析變量聲明、分析函數(shù)聲明三個(gè)部分.通過詞法分析將我們寫的js代碼轉(zhuǎn)成可以執(zhí)行的代碼，接下來才是執(zhí)行。

????變量提升還有一種情況，就是函數(shù)，詞法分析的時(shí)候關(guān)于函數(shù)聲明的處理與變量聲明的處理不太一致，會一步到位的給當(dāng)前函數(shù)活動對象增加對應(yīng)函數(shù)名的屬性，并重寫該方法。也就是不會像變量那樣先賦值undefined了。說的有點(diǎn)繞，我們還是看代碼，可以先自己看一下執(zhí)行結(jié)果，再看下面的分析：

function a(){var b = 'a';function b(){console.log('b')}alert(b) } a()

????簡單說下，詞法分析時(shí)對function b的處理：給當(dāng)前函數(shù)活動對象obj增加屬性b，并賦值。即：obj.a = function(){...}; 所以詞法分析后的結(jié)果成了這個(gè)樣子：

function a(){var b = undefined;b = function b(){console.log('b')}b = 'a';alert(b); // a } a()

????這個(gè)地方也只是我讀別人觀點(diǎn)的一種借鑒，但是我有點(diǎn)不太確定的是普通變量提升和函數(shù)提升同時(shí)進(jìn)行時(shí)到底誰在最頂端？反正就目前我的認(rèn)識變量提升的規(guī)律是清楚了，大提升提升的原理是因?yàn)镴S運(yùn)行機(jī)制的問題，為了盡量避免變量提升帶來的一些困擾，日常開發(fā)中文名還是要養(yǎng)成先聲明再使用的好習(xí)慣，盡量在函數(shù)開頭把所有變量都聲明出來。文中觀點(diǎn)大都是個(gè)人理解，如有不對，歡迎指出！

參考文章： https://www.cnblogs.com/huilixieqi/p/6473572.html

轉(zhuǎn)載于:https://www.cnblogs.com/wancheng7/p/8306711.html

總結(jié)

以上是生活随笔為你收集整理的关于JS中变量提升的规则和原理的一点理解（一）的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。