JavaScript塊級(jí)作用域綁定的實(shí)現(xiàn)流程
1.var聲明和變量提升
無(wú)論是在函數(shù)作用域亦或是全局作用中使用var聲明的變量，都會(huì)在預(yù)編譯階段被提升到當(dāng)前作用域的頂部。
function func(condition) {
if(condition){
var value = "value";
return value;
} else {
//此處可訪問(wèn)到value，但值為undefined
return null;
}
//此處可訪問(wèn)到value，但值為undefined
}
通常在擁有塊級(jí)作用域的語(yǔ)言中，上述代碼塊只會(huì)在當(dāng)參數(shù)condition的值為true時(shí)，value變量才會(huì)被創(chuàng)建,且只能在if代碼塊中被訪問(wèn)到。但在js中，無(wú)論condition的值是什么，value變量都會(huì)被創(chuàng)建，它再預(yù)編譯階段中的實(shí)際表現(xiàn)如下：
function func(condition) {
var value;
if(condition){
var value = "value";
return value;
} else {
return null;
}
}
2.塊級(jí)聲明和臨時(shí)死區(qū)
塊級(jí)聲明會(huì)將當(dāng)前聲明變量的作用域限制在函數(shù)作用域或塊級(jí)作用域內(nèi)部，其他非作用區(qū)域訪問(wèn)會(huì)得到undefined。
function func(condition) {
if(condition){
let value = "value";
return value;
} else {
//此處訪問(wèn)value會(huì)報(bào)錯(cuò)
return null;
}
//此處訪問(wèn)value會(huì)報(bào)錯(cuò)
}
使用let或const的聲明的變量會(huì)在預(yù)編譯階段被加入到臨時(shí)性死區(qū)(TDZ)中,訪問(wèn)臨時(shí)性死區(qū)中的變量會(huì)觸發(fā)引用錯(cuò)誤。
3.禁止重復(fù)聲明
使用var聲明同名變量時(shí)，不會(huì)產(chǎn)生任何問(wèn)題，因?yàn)樗皇窍喈?dāng)于一個(gè)賦值操作。
function(condition) {
var value = "value";
var value = "val";
//相當(dāng)于
var value = "value";
value = "val";
}
但使用let和const聲明變量時(shí)，會(huì)禁止聲明同名變量，拋出變量已定義異常。
4.塊級(jí)作用域綁定的最佳實(shí)踐
變量定義默認(rèn)使用const，只有確實(shí)需要改變變量的值時(shí)使用let。
到此這篇關(guān)于JavaScript塊級(jí)作用域綁定的實(shí)現(xiàn)流程的文章就介紹到這了,更多相關(guān)JS塊級(jí)作用域綁定內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
超級(jí)簡(jiǎn)單實(shí)現(xiàn)JavaScript MVC 樣式框架
本文給大家分享的是一則翻譯過(guò)來(lái)的，由國(guó)外友人寫的如何簡(jiǎn)單有效的實(shí)現(xiàn)javascript MVC樣式框架，算是一個(gè)MVC的入門教程，希望大家能夠喜歡。2015-03-03
javascript實(shí)現(xiàn)控制瀏覽器全屏
這篇文章主要介紹了javascript實(shí)現(xiàn)控制瀏覽器全屏的代碼分享給大家，十分的實(shí)用，有需要的小伙伴可以參考下。2015-03-03
這篇文章主要介紹了Express的路由詳解的相關(guān)資料,需要的朋友可以參考下2015-12-12
avascript中的自執(zhí)行匿名函數(shù)應(yīng)用示例
javascript中的自執(zhí)行匿名函數(shù)可以用它創(chuàng)建命名空間，只要把自己所有的代碼都寫在這個(gè)特殊的函數(shù)包裝內(nèi)，那么外部就不能訪問(wèn)，除非你允許2014-09-09
JavaScript實(shí)現(xiàn)大文件上傳的示例代碼
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)大文件上傳功能的示例代碼，文中的代碼講解詳細(xì)，對(duì)我們學(xué)習(xí)JavaScript有一定幫助，感興趣可以跟隨小編一起學(xué)習(xí)一下2022-11-11
JavaScript中判斷某個(gè)字符串、數(shù)組等是否包含某個(gè)值的五種方法
在JavaScript中有多種方法可以用來(lái)判斷字符串、數(shù)組是否包含某個(gè)值,這篇文章主要給大家介紹了關(guān)于JavaScript中判斷某個(gè)字符串、數(shù)組等是否包含某個(gè)值的五種方法,需要的朋友可以參考下2024-03-03
這篇文章主要介紹了一文讓你快速了解JavaScript棧，棧全稱為堆棧，是一種先進(jìn)后出的的數(shù)據(jù)結(jié)構(gòu)，棧中只有兩種基本操作，也就是插入和刪除，也就是入棧和出棧操作，棧只有一端可以進(jìn)行入棧和出棧操作，我們將其稱為棧頂，另一端稱其為棧底2022-07-07
鼠標(biāo)拖動(dòng)改變DIV等網(wǎng)頁(yè)元素的大小的實(shí)現(xiàn)方法
下面小編就為大家?guī)?lái)一篇鼠標(biāo)拖動(dòng)改變DIV等網(wǎng)頁(yè)元素的大小的實(shí)現(xiàn)方法。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-07-07
如何利用 JS 腳本實(shí)現(xiàn)網(wǎng)頁(yè)全自動(dòng)秒殺搶購(gòu)功能
這篇文章主要介紹了如何利用 JS 腳本實(shí)現(xiàn)網(wǎng)頁(yè)全自動(dòng)秒殺搶購(gòu)功能,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2020-10-10
JavaScript 獲取瀏覽器的類型和頁(yè)面編碼的函數(shù)代碼。2010-06-06