摘要:塊級(jí)聲明前是沒(méi)有塊級(jí)作用域的,比如外可以訪(fǎng)問(wèn)內(nèi)部的變量。循環(huán)中的塊作用域綁定我們經(jīng)常使用循環(huán)發(fā)現(xiàn)了什么在循環(huán)執(zhí)行后,我們?nèi)匀豢梢栽L(fǎng)問(wèn)到變量。
var聲明及變量提升機(jī)制
在ES6之前,在函數(shù)作用域中或者全局作用域中通過(guò)var關(guān)鍵字來(lái)聲明變量,無(wú)論是在代碼的哪個(gè)位置,這條聲明語(yǔ)句都會(huì)提到最頂部來(lái)執(zhí)行,這就是變量聲明提升。
注意:只是聲明提升,初始化并沒(méi)有提升。
看一個(gè)例子:
function getStudent(name){ if(name){ var age=25; }else{ console.log("name不存在"); } console.log(age); //undefined }
如果按照預(yù)想的代碼的執(zhí)行順序,當(dāng)name有值時(shí)才會(huì)創(chuàng)建變量age,可是執(zhí)行代碼發(fā)現(xiàn),即使不傳入name,判斷語(yǔ)句外的輸出語(yǔ)句并沒(méi)有報(bào)錯(cuò),而是輸出undefined。
這就是變量聲明提升。
塊級(jí)聲明ES6前是沒(méi)有塊級(jí)作用域的,比如{}外可以訪(fǎng)問(wèn)內(nèi)部的變量。
let聲明聲明變量
作用域限制在當(dāng)前代碼塊
聲明不會(huì)提升
禁止重聲明(同一作用域不行,可以覆蓋外部同名變量)
function getStudent(name){ if(name){ let age=25; console.log(age); //25 }else{ console.log("name不存在"); } console.log(age); //age is not defined }
和上文一樣的代碼,只是將age的命名關(guān)鍵字從var改成了let,在執(zhí)行getStudent()和getStudent("axuebin")時(shí)都會(huì)報(bào)錯(cuò)。
原因:
在if語(yǔ)句內(nèi)部執(zhí)行之后,age變量將立即被銷(xiāo)毀
如果name為空,則永遠(yuǎn)都不會(huì)創(chuàng)建age變量
const聲明聲明常量
必須初始化
不可更改
作用域限制在當(dāng)前代碼塊
聲明不會(huì)提升
禁止重聲明(同一作用域不行,可以覆蓋外部同名變量)
如果用const來(lái)聲明對(duì)象,則對(duì)象中的值可以修改。
臨時(shí)死區(qū)(Temporal Dead Zone)JavaScript引擎在掃面代碼發(fā)現(xiàn)聲明變量時(shí),遇到var則提升到作用域頂部,遇到let和const則放到TDZ中。當(dāng)執(zhí)行了變量聲明語(yǔ)句后,TDZ中的變量才能正常訪(fǎng)問(wèn)。
循環(huán)中的塊作用域綁定我們經(jīng)常使用for循環(huán):
for(var i=0;i<10;i++){ console.log(i); //0,1,2,3,4,5,6,7,8,9 } console.log(i) //10
發(fā)現(xiàn)了什么?
在for循環(huán)執(zhí)行后,我們?nèi)匀豢梢栽L(fǎng)問(wèn)到變量i。
So easy ~ 把var換成let就解決了~
for(let i=0;i<10;i++){ console.log(i); //0,1,2,3,4,5,6,7,8,9 } console.log(i) //i is not defined
還記得當(dāng)初講閉包時(shí)setTimeout循環(huán)各一秒輸出i的那個(gè)例子嗎~
曾經(jīng)熟悉的你 ~
for(var i=0;i<10;i++){ setTimeout(function(){ console.log(i); //10,10,10..... },1000) }
很顯然,上面的代碼輸出了10次的10,setTimeout在執(zhí)行了循環(huán)之后才執(zhí)行,此時(shí)i已經(jīng)是10了~
之前,我們這樣做 ~
for(var i=0;i<10;i++){ setTimeout((function(i){ console.log(i); //0,1,2,3,4,5,6,7,8,9 })(i),1000) }
現(xiàn)在,我們這樣做 ~ 來(lái)看看把var改成let會(huì)怎樣~
for(let i=0;i<10;i++){ setTimeout(function(){ console.log(i); //0,1,2,3,4,5,6,7,8,9 },1000) }
nice~
全局塊作用域綁定在全局作用域下聲明的時(shí)
var會(huì)覆蓋window對(duì)象中的屬性
let和const會(huì)屏蔽,而不是覆蓋,用window.還能訪(fǎng)問(wèn)到
歡迎來(lái)小白這逛逛~ 原文鏈接
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://systransis.cn/yun/84050.html
摘要:命令用來(lái)聲明變量,它的用法類(lèi)似,但是命令聲明的變量只在所在的代碼塊中有效。不允許重復(fù)聲明不允許在同一作用域聲明兩個(gè)相同的變量。對(duì)于內(nèi)部的數(shù)據(jù)結(jié)構(gòu)的變化是無(wú)法控制的。 let命令 用來(lái)聲明變量,它的用法類(lèi)似var,但是let命令聲明的變量只在所在的代碼塊中有效。 { var a = 1; let b = 2; } console.log(a); // 1 con...
摘要:聲明聲明的語(yǔ)法與的語(yǔ)法一致??偨Y(jié)文章都是以深入理解讀書(shū)筆記形式,大部分引用書(shū)中的定義,加上作者的理解,樣例也做了調(diào)整,所有樣例都可以放到里運(yùn)行親自嘗試。 1.變量提升 使用 var 關(guān)鍵字聲明的變量,無(wú)論其實(shí)際聲明位置在何處,都會(huì)被視為聲明于所在函數(shù)的 頂部(如果聲明不在任意函數(shù)內(nèi),則視為在全局作用域的頂部)。這句話(huà)從字面上不難理解。 但是他是怎樣一個(gè)過(guò)程,為什么會(huì)這樣。當(dāng)你代...
摘要:和都能夠聲明塊級(jí)作用域,用法和是類(lèi)似的,的特點(diǎn)是不會(huì)變量提升,而是被鎖在當(dāng)前塊中。聲明常量,一旦聲明,不可更改,而且常量必須初始化賦值。臨時(shí)死區(qū)臨時(shí)死區(qū)的意思是在當(dāng)前作用域的塊內(nèi),在聲明變量前的區(qū)域叫做臨時(shí)死區(qū)。 主要知識(shí)點(diǎn)有:var變量提升、let聲明、const聲明、let和const的比較、塊級(jí)綁定的應(yīng)用場(chǎng)景showImg(https://segmentfault.com/img...
摘要:眾所周知,中的聲明存在變量提升機(jī)制,因此引用了塊級(jí)作用域來(lái)強(qiáng)化對(duì)變量生命周期的控制聲明不會(huì)被提升,有幾個(gè)需要注意的點(diǎn)不能被重復(fù)聲明假設(shè)作用域中已經(jīng)存在某個(gè)標(biāo)識(shí)符無(wú)論該標(biāo)識(shí)符是通過(guò)聲明還是變量聲明,此時(shí)再使用或關(guān)鍵定聲明會(huì)拋錯(cuò)此處則會(huì)拋出錯(cuò)誤 眾所周知,js中的var聲明存在變量提升機(jī)制,因此ESMAScript 6引用了塊級(jí)作用域來(lái)強(qiáng)化對(duì)變量生命周期的控制let const 聲明不會(huì)被...
閱讀 3781·2021-08-30 09:47
閱讀 3718·2019-08-30 15:56
閱讀 684·2019-08-30 14:18
閱讀 704·2019-08-29 16:17
閱讀 2071·2019-08-29 11:07
閱讀 649·2019-08-26 13:53
閱讀 3456·2019-08-26 10:26
閱讀 2502·2019-08-23 18:30