1.變數：var，let，const-有解無憂

var在ECMAScript的所有版本中都可以使用，而const和let只能在ES6及更晚的版本中使用，

var，let，const三個關鍵字的區別

var：

1）宣告作用域：在函式內部，使用var定義一個變數（區域變數），在函式被呼叫完之后，該變數會被立即銷毀，在定義變數時如果省略var,就會創建一個全域變數（不建議在區域作用域中定義全域變數，難維護，而且在嚴格模式下，會導致拋出ReferenceError），

2）宣告提升：把所有變數宣告都拉到函式作用域的頂部，

function foo(){
    console.log(age);
    var age = 18;
}

等價于

function foo(){
    var age;
    console.log(age);
    age = 18;
}
foo();//undefined

3）可以反復多次使用var宣告同一個變數

function foo(){
var age = 16;
var age = 1;
var age = 2;
console.log(age);
}
foo();//2

4）全域宣告：使用var在全域作用域中宣告的變數會成為window物件的屬性，

var age = 18;
console.log(window.age);//18

let:

1）宣告作用域：let宣告的是塊作用域，而var宣告的是函式作用域，塊作用域是函式作用域的子集，所以var作用域的限制同時也適用于let

//var
if(true){
    var age = 18;
    console.log(age);//18
}
console.log(age);//18

//let
if(true){
    let age = 18;
    console.log(age);//18
}
console.log(age);//ReferenceError:age沒有定義

2）宣告提升：let宣告的變數不會在作用域中被提升

3）不可以在一個塊中反復多次使用let宣告同一個變數

let age;
let age;//SyntaxError,識別符號age已經宣告過了

4）全域宣告：使用let在全域作用域中宣告的變數不會成為window物件的屬性，但是var宣告的變數會，

let age = 18;
console.log(window.age);//undefined

5）條件宣告：在使用var宣告變數時，由于宣告會被提升，JS會自動將多余的宣告在作用域頂部合并為一個宣告，而因為let的作用域是塊，所以不可能檢查前面是否已經使用let宣告過同名變數，因此對于let，不能依賴條件宣告模式，

6）for回圈中的let宣告：在用let宣告迭代變數時，JS在后臺會為每個迭代變數宣告一個新的迭代變數，每個setTimeout參考的都是不同的迭代變數，for-in 和for-of都適用，

for(var i=0;1<5;i++){}
console.log(i);  //5

for(let i=0;1<5;i++){}
console.log(i);  //ReferenceError:i沒有定義

for(var i=0;1<5;i++){
    setTimeout(()=>console.log(i),0);
}
//會輸出5，5，5，5，5

for(let i=0;1<5;i++){
    setTimeout(()=>console.log(i),0);
}
//會輸出0，1，2，3，4

const:

1）const的行為和let基本相同，唯一的區別是const它宣告變數時必須同時初始化變數，且嘗試修改const宣告的變數會導致運行時錯誤（TypeError），

2）不允許重復宣告

3）作用域也是塊

4）const宣告的限制只適用于它指向的變數的參考，換句話說，如果const變數參考的是一個物件，那么修改這個物件內部的屬性并不違反const的限制，

const person = {};
person.name = "QiuYing";

5)不能用const宣告迭代變數，因為迭代變數會自增，但是可以宣告一個不會被修改的for回圈變數，這對for-in 和for-of回圈特別有意義，

宣告風格及最佳實踐：先使用const,let次之，不使用var

轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/152432.html

標籤：其他

上一篇：微信小程式框架分析小練手（三）——仿香哈菜譜小程式制作

下一篇：電腦藍屏問題