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