JavaScript中使用var去宣告變數，es6拓展兩個，let和const

let和const都有塊級作用域

什麼是塊級作用域，簡單理解就是一個大括號就是一個塊

我們先看一個var定義的變數

if(false) {
  var a = 100;
}

console.log(a) // undefined

注意：undefined不是錯誤，而是一種特殊的資料型別，是合法的，允許存在的，所以就說明一個問題，if語句的括號沒有限制住a的作用域，所以我們可以這麼認為var定義的變數是沒有塊級作用域的

我們再來看一下let和const的定義的變數

//let定義的變數
if(true) {
  let b 
 
= 200;
}
console.log(b) //報錯

// const定義的變數
if(false) {
  const c = 300;
}
console.log(c) //報錯

發現let和const定義的變數，無論if條件中為true或者false，內部的括號都會封閉自己的作用域

總結：let和const定義的變數有一個特點，就是在哪一級定義的，就在哪一級使用，因為有自己的塊限制

不僅if條件語句可以作為塊級作用域，迴圈語句也可以

使用var定義一個數組

var a = [];
for (var i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[
 
6](); // 10

再看使用let定義的陣列

var a = [];
for (let i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 6

let和const宣告的變數都沒有宣告提升

什麼是變數宣告的提升?

看var定義的變數

console.log(a) // undefined
var a = 100;

發現a會返回undefined，並不會報錯，那是因為a此時已經定義了，並且提升到了當前作用域（全域性作用域或者函式的作用域）的最頂部

所以上面的程式碼和下面的程式碼是等價的

var a;
console.log(a) // undefined
a = 100;

所以var是有變數宣告提升的。

// let 宣告
console.log(b) // 報錯
let b = 200;

// const 宣告
console.log(c) // 報錯
const c = 300;

我們再看let和const

上面錯誤資訊的大致意思就是b或者c不能再初始化之前使用，所以let和const不能進行變數宣告提升，必須在變數的聲明後進行使用

let和const是會出現暫時性死區

什麼是暫時性死區？

先看var定義的變數

//var定義
var tmp = 123;

if (true) {
  tmp = 'abc'; 
  var tmp;
}

我們再看let和const定義的變數

// let 定義
var tmp = 123;

if (true) {
  tmp = 'abc'; // 報錯
  let tmp;
}

// const 定義
var tmp = 123;

if (true) {
  tmp = 'abc'; // 報錯
  const tmp;
}

{
  var a = 100;
  let a = 200;
}

發現重複定義變數也會報錯

暫時性死區和重複定義有著一定關聯關係，我們所說的暫時性死區和重複定義變數都是需要避免的，會報錯影響我們的主流程的，所以一定要理解含義，而不是去模仿暫時性死區或者重複定義變數的問題

let定義的是變數，const定義的是常量

var定義的就是變數，let和之有類似

let a = 100;
a = 200; // 正常修改

const b = 100;
b = 200; // 報錯

發現const定義的是常量，常量是不允許修改的，什麼時候會用到常量，比如我們定義一個基數（PI）const PI = 3.14這個PI常量就一定不能修改

let和const定義的全域性變數不是window的屬性

var定義的全域性變數是window的屬性

var a = 12345;
console.log(window.a) // 12345

let 和 const定義的全域性變數不會成為window的屬性

let a = 12345;
console.log(window.a) // undefined
const b = 12345;
console.log(window.b) // undefined