您好,登錄后才能下訂單哦!
本篇文章給大家分享的是有關(guān)JavaScript中var與let的區(qū)別是什么,小編覺(jué)得挺實(shí)用的,因此分享給大家學(xué)習(xí),希望大家閱讀完這篇文章后可以有所收獲,話不多說(shuō),跟著小編一起來(lái)看看吧。
前言:
var
是JavaScript
剛出現(xiàn)時(shí)就存在的變量聲明關(guān)鍵字,而let作為ES6才出現(xiàn)的變量聲明關(guān)鍵字,無(wú)疑兩者之間存在著很大的區(qū)別。那么具體有哪些區(qū)別呢?
var是函數(shù)作用域,let是塊級(jí)作用域
{ var monkey='熏悟空'; let pig='豬扒蓋'; } console.log(monkey); //輸出undefined console.log(pig); //報(bào)錯(cuò):pig is not deined
由上面代碼可見,let
聲明的變量只在其所在的代碼塊有效,在代碼塊外部無(wú)效無(wú)法訪問(wèn),而var聲明的變量在該代碼塊所在的函數(shù)作用域內(nèi)都有效。
var聲明的變量會(huì)進(jìn)行變量提升,let聲明的變量不會(huì)進(jìn)行變量提升。
console.log(monkey); //undefined var monkey='熏悟空'; console.log(pig); //報(bào)錯(cuò):pig is not defined let pig='豬扒蓋';
同樣的邏輯,為什么var聲明的變量在它聲明之前調(diào)用會(huì)顯示未定義,而let聲明的變量在聲明之前調(diào)用會(huì)拋出異常呢,這就是兩者在變量提升上的區(qū)別,var聲明的變量存在變量提升,let聲明的變量不存在變量提升。
那么什么叫變量提升呢,我這里不做概念性的描述,我只說(shuō)我個(gè)人的理解,就是以上代碼實(shí)際上相當(dāng)于如下:
var monkey; console.log(monkey); //undefined monkey='熏悟空'; console.log(pig); //報(bào)錯(cuò):pig is not defined let pig='豬扒蓋';
看見區(qū)別了嗎,var聲明的變量會(huì)將聲明的變量提取到作用域的最上面進(jìn)行定義但不賦值,賦值操作還是在你的代碼處,所以你在調(diào)用var
聲明的變量時(shí)就是一個(gè)已經(jīng)聲明但是并未定義值的變量,所以調(diào)用結(jié)果就是undefined
,這就是所謂的變量提升。而let定義的變量不存在這種變量提升。
暫時(shí)性死區(qū):如果在某一作用域內(nèi)let了一個(gè)變量,如果外部作用域中有相同名稱的變量,那么就算在作用域內(nèi)進(jìn)行了更改,也不會(huì)影響到外部作用域
具體表現(xiàn)如下:
for(var i=0;i<5;i++){ setTimeout(function(){ console.log(i) },1000) } for(let i=0;i<5;i++){ setTimeout(function(){ console.log(i) },1000) }
請(qǐng)問(wèn)這兩處代碼的運(yùn)行結(jié)果分別是什么?
第一處代碼運(yùn)行完畢的結(jié)果是1s后順序打印5個(gè)5;第二處代碼運(yùn)行完畢的結(jié)果是1s后順序打印0,1,2,3,4。
請(qǐng)問(wèn)為什么會(huì)存在這種區(qū)別?
因?yàn)榈谝惶幋a的變量i由var關(guān)鍵字聲明,不存在關(guān)鍵性死區(qū),即你在1s后setTimeout
中訪問(wèn)到的變量i是全局上下文中for循環(huán)運(yùn)行完畢之后的i,所以打印的結(jié)果全是5;
而第二處代碼的變量i由let關(guān)鍵字聲明,產(chǎn)生了關(guān)鍵性死區(qū),存在setTimeout
中的i變量是你當(dāng)時(shí)存儲(chǔ)時(shí)的i的值,這個(gè)存儲(chǔ)區(qū)間的i不會(huì)因?yàn)橥饷嬗邢嗤膇變量且賦了不同的值而改變,他依舊是之前存儲(chǔ)進(jìn)去的值,這就是暫時(shí)性死區(qū)的表現(xiàn),也是為什么第二處代碼運(yùn)行完畢是順序打印0,1,2,3,4的原因。
let monkey='熏悟空'; let monkey='逼馬吻'; //報(bào)錯(cuò):Identifier 'a' has already been declared var pig='豬扒蓋'; var pig='豬肛裂'; //正常訪問(wèn),變量pig的值被替換
以上就是JavaScript中var與let的區(qū)別是什么,小編相信有部分知識(shí)點(diǎn)可能是我們?nèi)粘9ぷ鲿?huì)見到或用到的。希望你能通過(guò)這篇文章學(xué)到更多知識(shí)。更多詳情敬請(qǐng)關(guān)注億速云行業(yè)資訊頻道。
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。