[JavaScript ES6] 宣告變數 let 與 const
JavaScript 的 ES6
中,多了兩種宣告變數的方法, let
與 const
, 這兩種宣告的方式出現,使 JavaScript 在編碼上更加的嚴謹,但相對的 提高
了不少的 可讀性
,給 降低
了許多 維護成本
, 下面說明會那原有的 var
宣告方式進行比較:
const 的宣告方式,比較容易理解,先從 const 進行說明:
const :
const
是在 ES6
中,專門為 常數
提供的宣告方式,如下:
const x = 10;
但要特別說明的是: 使用 const
宣告 常數
時,一定要賦予值
,如果沒有 賦予值,是會 SyntaxError
的錯誤的,如下:
const x; //SyntaxError
另外使用 const
宣告 常數
之後,被宣告的 常數
是 無法覆寫或更新的
, 如下:
const x =10;
x = 20; //SyntaxError
let:
let
的宣告方式,與我們平常使用的 var
很相近,這兩者的差異在於 作用域(scope)
,下面以實例說明:
關於 var 的 作用域(scope),可以查看 [JavaScript] 宣告變數 與 作用域,進一步理解
這邊我們先用 var
的方式進行宣告 i
:
範例編碼:
function test(){
for(var i = 0; i < 3; i++){
console.log(i,'for loop scope')
}
console.log(i,'test function scop')
}
test();
結果如下:
0 "for loop scope"
1 "for loop scope"
2 "for loop scope"
3 "test function scop" //注意這行
接著我們先用 let
的方式進行宣告 i
:
範例編碼:
function test(){
for(let i = 0; i < 3; i++){
console.log(i,'for loop scope')
}
console.log(i,'test function scop')
}
test();
結果如下:
0 "for loop scope"
1 "for loop scope"
2 "for loop scope"
"Uncaught ReferenceError: i is not defined" //注意這行
以上上面的實例來看,我們可以得知 var
與 let
兩者的作用域差異:
var
的作用域(scope)
以function
為一個臨界點,在function
內都可以提取到i
的值
let
的作用域(scope)
以程式區塊(大刮號)
為一個臨界點,在程式區塊(大刮號)
內都可以提取到i
的值