【從零開始學JavaScript】宣告變數

var : JavaScript在ES6推出之前的基本宣告方式

1	var temp = 100; // 將變數temp賦予值，其值為數字100

let : JavaScript在ES6後新增的宣告方式，作用與var類似

1	let abc = "apple"; // 將變數abc賦予值，其值為字串apple

var : 在ES6之前，所有變數都是由var去宣告，但這也引發三個以下大問題
- 語法允許重複宣告
  1
  2
  3
  var a = 1;
  var a = 2;
  console.log(a); // 顯示2
  透過上述程式碼可知，var是允許重複宣告的，並不會跳出任何錯誤或警告，很容易忽略自己曾宣告過，進而產生小型Bug。
- 不支援區塊作用域
  1
  2
  3
  4
  5
  6
  for(var i=0; i<3; i++){
  console.log(i,"Hi");
  // 依次出現 0 "Hi"、1 "Hi"、2 "Hi"
  }
  
  console.log(i); // 出現3
  透過上述程式碼可知，i其實被設為全域變數，而區塊語句（if、else、for、while等)卻會汙染i。而引發這一切的原因，正是因為JavaScript在ES6前並未有區塊域(Bolck)的概念。
- 不支援常數特性
  1
  2
  3
  4
  var PI = 3.14;
  console.log(PI); // 顯示3.14
  PI = 1234;
  console.log(PI); // 顯示1234
  PI為常數，本身是無法更改的，但var語法允許重複宣告的特性，如果PI在程式某個小角落被誤改，就會造成整體運算結果的錯誤。總結來說，var並不能保護常數性質的變數。

let : 禁止同一層區塊域(Block)重複宣告變數

1
2
3

let a = 1;
let a = 2;
console.log(a); // Error，原因是a已經重複宣告過

但如果分層宣告就不會彼此衝突

let a = 1; // 此為全域變數
function tmp(){
    let a = 2; // 此為區域變數
    console.log(a);
}
tmp(); // 顯示2

console.log(a); // 顯示1

const : 可以視為let的常數加強版，擁有let的性質

1
2
3

const a = 1;
const a = 2;
console.log(a); // Error，原因是a已經重複宣告過

const同時也能保護常數性質的變數，使其一旦給值後，就無法重新賦值。

1
2
3

const a = 1;
a = 2;
console.log(a); // Error，原因是a不能重新給予值