序言

　　開發中經常遇到變數的定義，平時就是一股腦的var或者全域性的時候就不寫var，所以為了清醒認識他們之間的區別，此處做個記錄。

正文

1、var

帶var定義的變數只有函式內作用域和全域性作用域,作為全域性變數時掛載在window物件上,configurable為false。var定義的變數可以修改，如果不初始化會輸出undefined，不會報錯。

var a = 1;
// var a;//不會報錯
console.log('函式外var定義a：' + a);//可以輸出a=1
function change(){
a = 4;
console.log('函式內var定義a：' + a);//可以輸出a=4
 

} 
change();
console.log('函式呼叫後var定義a為函式內部修改值：' + a);//可以輸出a=4

delete a; //return true,刪除失敗,因為configurable為false

2 不帶var

不帶var定義的變數,全域性作用域,掛載在window物件上,configurable為true。

x=3;  //掛載於window.x

//匿名箭頭函式，自執行函式
(()=>{
  x=5;   //x被改變
  console.log(x)
})()   //輸出5
console.log(x); //輸出5
Object.getOwnPropertyDescriptor(window,'x') 
 
//{value: 5, writable: true, enumerable: true, configurable: true}
delete x; //return true,刪除成功,因為configurable為true

3 let

let定義的變數具有塊級作用域,不能重複定義,configurable為false，函式內部使用let定義後，對函式外部無影響。

let x;    //正確,可以不用初始化.x為undefined 
let x=5;  //報錯,不能重複定義
let i=3;   //全域性作用域
{ 
  let i=4;  //作用域為花括號內
  console.log(i);  //
 
輸出4
}

//匿名箭頭函式，定義後執行
(()=>{
  let i=5;   //區域性變數
  console.log(i)
})()   //輸出5
console.log(i)  //輸出3
delete i;  //return false

4 const

const擁有let所有性質,但const不能被直接修改,必須被初始化,configurable為false

const i=1;
i=5;  //報錯,const定義的不能直接修改    
const p={
  name:"Minions",
  age:8
}  //定義字面量物件p
p={
  name:"xx"
} //報錯,不能直接修改p
p.age=16; //正確修改
delete p;  //return false

有趣的面試例子

面試的時候很經常遇到一個例子：

for (var i = 0; i < 5; i++) {
    setTimeout(function() {
        console.log(i);
    }, 1000);
}
//這個例子執行完輸出什麼結果？

//答案是 5,5,5,5,5

//如果想要輸出0,1,2,3,4改怎麼實現？
//其中一種方案就是把var換成let就可以了。let的塊級作用域在這裡就體現出來了。

for (let i = 0; i < 5; i++) {
    setTimeout(function() {
        console.log(i);
    }, 1000);
}

——(完)——