1.變量:var,let,const

var在ECMAScript的全部版本中均可以使用,而const和let只能在ES6及更晚的版本中使用。函數

var,let,const三個關鍵字的區別spa

var:code

1)聲明做用域:在函數內部,使用var定義一個變量(局部變量),在函數被調用完以後,該變量會被當即銷燬。在定義變量時若是省略var,就會建立一個全局變量(不建議在局部做用域中定義全局變量,難維護,並且在嚴格模式下,會致使拋出ReferenceError)。對象

2)聲明提高:把全部變量聲明都拉到函數做用域的頂部。blog

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

等價於ip

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對象的屬性。io

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

let:console

1)聲明做用域:let聲明的是做用域,而var聲明的是函數做用域。塊做用域是函數做用域的子集,因此var做用域的限制同時也適用於letfor循環

//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

相關文章
相關標籤/搜索