所以在本文中,我將會通過一些例子來為大家介紹如何在Javascript中靈活使用var、let和const這些關(guān)鍵字來定義變量,以及這些關(guān)鍵字它們之間有什么異同。
如果你懶得看下面的代碼,那我可以先把概念結(jié)論說出:
var定義的變量可被更改,如果不初始化而直接使用也不會報錯
let定義的變量和var類似,但作用域在當前聲明的范圍內(nèi)
const定義的變量只可初始化一次且作用域內(nèi)不可被更改,使用前必須初始化
下面我將通過示例的形式來詳細為大家介紹它們?nèi)咧g的異同:
Var
var用以聲明一個變量,并且同時我們可以在聲明語句中初始化所聲明的變量。
例如:
var a = 10;
變量的聲明,會在代碼被執(zhí)行之前被處理。
用var聲明的JavaScript變量,其可用范圍在當前執(zhí)行上下文。
在函數(shù)外聲明的JavaScript變量,其作用范圍是全局。
考慮以下代碼片段:
function nodeSimplified() { var a =10; console.log(a); // 輸出 10 if(true) { var a=20; console.log(a); // 輸出 20 } console.log(a); // 輸出 20 }
在上面的代碼中,你可以發(fā)現(xiàn),當變量a在if代碼段里被更新時,它的值被全局更新了,因此在經(jīng)過了if代碼后,被更新的值仍然被保留著。這與其他語言中的全局變量有點類似。但是,在使用這個功能時要非常小心,因為它有可能會覆蓋一個已有的值。
let
let語句在一個塊級范圍里聲明一個局部變量。和var類似,我們可以在聲明時初始化它的值。
例如:
let a = 10;
這個語句允許你創(chuàng)建一個變量,使它的作用范圍被限制在它所在的代碼塊。
它和Java、C#等其他語言的變量類似。
考慮下面的代碼片段:
function nodeSimplified() { let a =10; console.log(a); // output 10 if(true) { let a=20; console.log(a); // output 20 } console.log(a); // output 10 }
它和大多數(shù)語言中我們所見的表現(xiàn)行為是一致的。
function nodeSimplified() { let a =10; let a =20; // 拋出語法錯誤 console.log(a); }
錯誤信息:"未捕獲的異常:標識符'a'已經(jīng)被聲明過。" 但如果使用var就沒事:
function nodeSimplified() { var a =10; var a =20; console.log(a); // 輸出 20 }
使用let語句,可以很好的維護變量的作用范圍。當使用內(nèi)部函數(shù)時,let語句讓你的代碼更整潔。
我希望上面的例子能幫你更好地理解var和 let。如果有任何疑問,請在評論區(qū)留言。
const
const語言中的變量只能被賦值一次,然后就不能在被賦值。const語句的作用范圍和let語句一樣。
例如:
const a = 10; function nodeSimplified() { const MY_VARIABLE =10; console.log(MY_VARIABLE); // 輸出 10 }
照例,命名規(guī)范指出我們應(yīng)該用大寫字母聲明常量。當然,const a = 10 在上面的代碼中會的起到相同的作用。為了讓代碼長期可維護,命名規(guī)范還是值得遵守的。
問題:如果給一個const變量重新賦值會發(fā)生什么? 考慮下面的代碼:
function nodeSimplified() { const MY_VARIABLE =10; console.log(MY_VARIABLE); // 輸出 10 MY_VARIABLE =20; // 拋出類型錯誤 console.log(MY_VARIABLE); }
錯誤信息:"未捕獲的類型錯誤:給const變量賦值"。
當我們嘗試給已有的const變量賦值時,這段代碼會拋出一個錯誤。
介紹就到此結(jié)束,希望這篇短小精悍的文章能夠幫助到各位更好的理解在Javascript中聲明變量時使用不同關(guān)鍵字上到底有何異同。