關於ES6的塊級作用域
阿新 • • 發佈:2019-01-14
在ES5中是沒有塊級作用域的,只有全域性作用域與區域性作用域(函式作用域);
怎麼理解沒有塊級作用域呢?看接下來的例子:
for (var i = 0; i < 5; i++) {
{
console.log(i) //輸出0,1,2,3,4
}
}
console.log(i) //輸出5
用var宣告變數,變數i會被洩露為全域性變數,使得在任何地方i都能夠被讀取。
for (let i = 0; i < 5; i++) { { console.log(i) //輸出0,1,2,3,4 } } console.log(i) //輸出Uncaught ReferenceError: i is not defined
而用let宣告的變數,只在該作用域內有效,在外則無法讀取。
在編寫程式碼時很容易會遇到變數提升造成變數洩露成全域性變數,而且瀏覽器不會報錯,只是悄悄地把你某一個值改掉,使得糾錯時會比較麻煩,而ES6的塊級作用域很方便的解決了這個問題,看這段程式碼:
function f() {
var n = 1;
if (true) {
var n = 2;
function f() { let n = 1; if (true) { let n = 2; if (true) { let n = 3; console.log(n) //輸出1 } console.log(n) //輸出2 } console.log(n) //輸出3 }
if (true) { var n = 3; console.log(n) //輸出3 } console.log(n) //輸出3 } console.log(n) //輸出3 }
變數被覆蓋了;
如果將var 改為let :
由於形成塊級作用域,只輸出各自作用域內宣告的n。
塊級作用域的出現很好的解決了變數覆蓋以及變數洩露的問題。
有關於let與const的塊級作用域的問題,可以去看阮一峰老師寫的書,非常詳細:http://es6.ruanyifeng.com/