ES6系列（一）let和var的區別

在之前的js版本中，聲明變量一直都是用var, 這個估計大家都很熟悉了，那麼它的作用呢就是用來聲明一個變量，比如像這樣子：

var a = 10;

在這裏我們就用var聲明瞭一個變量a 並且在聲明的同時給這個變量a賦值了也就是10；那麼這時候如果我們去引用這個變量，那麼得到的結果就是10，這沒什麼稀奇的，在這裏就不再贅述了。

那麼在es6裏面新增了兩個聲明變量的方法，一個是let，用於聲明變量。一個是const，用於聲明常量。我們來看一下這三者之間的區別

這兩個關鍵字都是用於聲明變量的，在這種情況（先聲明後使用）下使用let和var的時候其實是沒有區別的。

var a = 10;
let b = 20;

console.log(a,b);// 10 20

區別一：變量提升用var聲明的變量會被提升，而用let聲明的變量不會被提升不過呢，我們都知道var關鍵字聲明變量的時候有一個東西，叫“變量提升”；也就是將變量聲明提升到它所在作用域的最開始的部分，比如：

console.log(a); //undefined
var a = 10;

如果在聲明這個變量之前去引用這個變量，如果這個變量是用var進行聲明的，那麼得到的結果其實是undefined,也就是爲定義的意思，但是這個變量是存在的。我們知道js在運行之前其實有一個與解析的過程，所以上面代碼在js去進行解析的時候，其實變成了這樣：

var a;
console.log(a);//undefined
a = 10;

可以看到變量a的聲明跑到console.log的前面去了，只是賦值還是在console.log之後進行賦值的，console.log得到的結果就是undefined. 這就是所謂的變量提升了。

這時候區別就來了：用var聲明的變量會被提升，而用let聲明的變量不會被提升也就是說：

console.log(b);//error:b is not defined
let b = 20;

在聲明之前去引用let聲明的變量會直接報錯，會直接阻斷程序的運行。

區別二：重複聲明用var可以重複聲明同一個變量，而let不可以我們知道，用var聲明一個變量之後，其實還可以再次用var去聲明這個變量，不過是後者覆蓋前者，並沒有太大意義。不過至少不會報錯，而如果用let去聲明變量的話，就得稍微注意一點，因爲let不可以在同一個作用域下重複聲明同一個變量：

var a = 10;
var a = 20;

let b = 10;
let b = 20;//error : Identifier 'b' has already been declared

如果用let重複聲明同一個變量，那麼這時候就會報錯：變量b已經被聲明瞭。

區別三：塊級作用域用let聲明的變量支持塊級作用域 es6新提出來了一個塊級作用域的概念，在之前，作用域只存在函數裏面，或者全局。而es6提出的塊級作用域則是一個大括號就是一個塊級作用域，也就是說if語句裏面都存在作用域概念了，比如：

if(true){
    var a = 12;
}
console.log(a);// 12


if(true){
    let b = 123;
}
console.log(b);//  error : b is not defined

和let一樣，const也是es6新增的關鍵字，let用於聲明變量，而const用於聲明常量。當然，const和let也有一些相同點： 1，const 不會變量提升，準確來說應該是常量提升，也就是說不會被提前與解析 2，const 不能重複聲明同一個常量 3，const 支持塊級作用域

然後我們再來說一下這兩個傢伙的不同點：

區別一：const聲明的常量不能被修改

正常來說，我們不管是用var聲明的變量，還是用let聲明的變量，後期都是可以對這個變量再次賦值的，也就是說可以修改。而常量一旦定義了，後期就不能修改了。如：

const pi = 3.1415926;
pi = 123;//error : Assignment to constant variable

一旦你嘗試着去修改一個常量的時候，瀏覽器就會告訴你，常量不可以被修改！

不過有一個方法是可以做到修改常量的，就是聲明常量的時候，給常量賦值一個對象，然後後期再去修改這個對象裏面的值就可以了，不過這麼做沒有任何的意義，常量存在的意義就在於其不可更改性。所以這個方法也就不再多說了

區別二：常量在聲明的時候，必須賦值

其實這一點特別好理解，常量在後期沒有辦法再次進行賦值，所以只能在聲明的時候進行賦值

另外有一點要特別關注一下，比如：

var abc= 123;
if (true) {
    abc= 'rstyjstyjd'; // referenceError
    let abc;
}

在上面的代碼中，存在全局變量abc, 但是塊級作用域內let又聲明瞭一個變量abc, 導致後者綁定這個塊級作用域，所以在let變量聲明之前，對tmp的賦值會報錯。

ES6中明確規定，如果區塊中存在let和const命令，這個區塊對這些命令聲明的變量，從一開始就形成了封閉作用域，凡是在聲明之前就使用這些變量就會報錯。

那麼以上就是關於es6在變量聲明這一塊的小改動啦！

發表評論

所有評論

還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.