使用 let 聲明變量
關鍵字 let
是 ES6
中新增的特性,它的出現是爲了解決 var
變量聲明所存在的一些問題,let
聲明變量的語法和 var
的很像,例如:
let a = 1;
其實 let
與 var
的關鍵的區別不在於語法,而在於語義。
在 let
中引入了塊級作用域(也可稱爲詞法作用域)。塊級作用域是什麼意思呢?我們知道使用大括號 {}
包圍代碼可以叫做代碼塊,舉個例子,比如說 if
、for
等語句的執行代碼都是通過一個大括號 {}
包圍對吧,這個大括號中的就是代碼塊。如果我們在大括號中使用 let
關鍵字聲明一個變量,那麼這個變量的作用域就只在這個大括號中,在大括號之外不能使用,這就是塊級作用域了。
所以這一點也是 let
和 var
之間的區別,如果同樣是在某個函數中的 if
語句內聲明變量,var
聲明的變量作用域範圍在整個函數,而 let
聲明的變量的範圍僅在 if
語句中。
示例:
我們可以看下面這段代碼,在函數 myFunc
中使用 let
聲明瞭一個變量 a,且在 if
語句中聲明瞭一個變量 b
:
function myFunc(){
let a = 10;
if(a > 5) {
let b = a;
return b;
}
return b;
}
根據我們上面講的塊級作用域,可以知道變量 a
的作用域就在整個 myFunc()
函數中,而變量 b
的作用域在 if
語句塊中,變量 a
可以在函數內使用,但是如果我們在 if
語句以外的地方使用變量 b
,則會出錯。
下圖是 VSCode 編輯器提示我們的報錯信息: 現在我們應該明白什麼是塊級作用域了吧,如果還不清楚,那就自己動手試一下吧。
變量提升
當我們使用關鍵字 var
聲明變量時會進行變量提升,而使用關鍵字 let
來聲明變量可以幫助我們解決這個問題。
變量提升是什麼意思呢,就是變量可以在使用後聲明,也就是變量可以先使用再聲明。但是要注意喲,變量提升只會提升聲明,不會提升變量的初始化喲。
示例:
例如下面這段代碼,我們先使用了變量 a
,然後才聲明它:
console.log(a);
var a = 1; // 聲明並賦值
運行代碼後,會輸出 undefined
(變量的默認值爲 undefined) ,這說明關鍵字 var
會進行變量提升,但是從輸出結果不是 1 可以看出,這僅提升了變量的聲明,沒有提升變量的初始化。
而如果我們將關鍵字 var
換成 let
,同樣的代碼 :
console.log(a);
let a = 1;
此時執行代碼,會輸出 ReferenceError: Cannot access 'a' before initialization
。這說明使用 let
聲明的變量並不會進行變量提升。
多次聲明一個變量
在使用 var
聲明變量的時候,我們可以同時聲明某個變量多次,但是隻有最後一個生效。
而 let
不支持這樣做,使用 let
聲明變量,一個變量同時只能聲明一次,否則會報錯。
示例:
例如使用 var
將變量 a
聲明 3
次,執行代碼後,只有最後一次生效,所以代碼的輸出結果爲 3:
var a = 1;
var a = 2;
var a = 3;
console.log(a);
// 輸出:3
而如果使用 let
重複聲明一個變量,則會報錯,報錯信息告訴我們已經聲明過了這個變量:
let a = 1;
let a = 2;
let a = 3;
console.log(a);
// Identifier 'a' has already been declared
const 聲明變量
const
與 let
聲明變量時一致,如下所示:
const num = 9;
const
也是塊級作用域,它與 let
唯一不同在於,const
聲明的變量只能在聲明時被賦值,之後不能再次被賦值,也就是說通過 const
聲明的變量被賦值後不能再改變。
使用 const
聲明變量,不是說被聲明的變量的值不能被改動,而是這個變量所指向的那個內存地址不能改動。使用 const
聲明數值、字符串、布爾值等數據類型,可以理解爲常量,因爲這些初始類型的值就保存在變量所指向的那個內存地址。
示例:
例如使用 const
聲明不同類型的變量:
const num = 9; // 數字類型
const username = 'xkd'; // 字符串類型
const my = true; // 布爾類型
如果我們修改這些變量(常量)的值會導致報錯:
但是對於數組和對象等複合類型的數據來說,變量所指向的內存地址保存的只是一個指針,const
可以讓其指針不變,但是數組元素和對象的屬性值可以被修改。
示例:
聲明一個對象,然後修改對象中的屬性: 從上圖我們可以看出,複合類型的數據,雖然不能直接對已經聲明的變量重新賦值,但是可以通過 對象.屬性
的方式來修改對象的屬性值。
我們在實際使用中,最好儘量使用let
和 const
來聲明變量,減少var
的使用。所有變量除了需要修改的都應該使用 const
聲明。