ES6 構文：let、var、const

let 、var 、 const

• var、let、const の違い： 0. 使い方
  1. ブロックスコープ
  2. 変数の巻き上げがない
  3. 一時的デッドゾーン
  4. 変数の再宣言ができない
  5. let、const で宣言したグローバル変数は最上位オブジェクトに属さない

使い方

• 変数の定義では let を var の代わりに使える
• const は一般に定数、無名関数、アロー関数などに使う
• 開発時は基本的に const を使い、値を本当に変更する場合だけ let を使う。たとえばコンポーネントの定義や map の処理で const で定義してから呼び出すと、構造が明確になり読みやすくなる。

ブロックスコープ

• ブロック宣言は、そのブロックの外からアクセスできない変数を宣言する。let と const はどちらもブロック宣言だ。

• ECMAScript 6 は、関数内部や現在のブロック内にブロックスコープを導入した。{ と } の間の領域で、if(){ xxxxxx この部分もブロック } も含まれる。

• ブロックスコープは何重にも入れ子にできる

• ブロックスコープの役割は、コードをブロックに分けることだ（eg：3）

• ブロックスコープで関数を宣言するなら、無名関数を使うのがよい。

{{{{
  {let test = 'Hello World'}
  console.log(test); // 报错  拿不到子作用域的变量
}}}};

Eg3：for (let i = 0; i < 3; i++) {
  let i = 'abc';
  console.log(i);
}

ここでの let は独立したスコープを持つため、abc が三回出力される。繰り返しのたびに新しい変数を作り、前回の同名変数の値で初期化する。この場合の let はクロージャーに似た働きをする。

変数の巻き上げがない

変数の巻き上げでは、同じスコープ内で宣言前に変数を使え、値は undefined となる。ES5 の var では巻き上げが起きる。ES6 で未宣言の値を直接 console に出すと Uncaught ReferenceError: xxxxxx is not defined が出る。

一時的デッドゾーン

• スコープに入った時点で変数は存在するが、参照はできない。変数を宣言する行に到達して初めて参照して使える。
• 一時的デッドゾーンと巻き上げの制限は、宣言前の使用による予期しない動作を防ぎ、実行時エラーを減らすためのものだ。

変数の再宣言は禁止

• let と const は同じスコープ内で同じ変数を再宣言できない

let、const で宣言したグローバル変数は最上位オブジェクトに属さない

• ブラウザー環境の最上位オブジェクトは window
• Node 環境の最上位オブジェクトは global

• var で宣言したグローバル変数はグローバルオブジェクトのプロパティとなり、最上位オブジェクトに属する。let と const はそうならない。

var value = 535;
console.log(window.value); // 535

let value = 535;
console.log(window.value); // undefined

• const は宣言と同時に代入する必要があり、代入後は変更できない。変数が指すメモリアドレスに保存されたデータは変えてはいけない。
  • 単純型（number、string、boolean）：メモリアドレスは値、つまり定数で、変更するとエラーになる。
  • 複雑な型（obj、arr など）：アドレスにはポインターが保存される。const はポインターが同じアドレスを指すことだけを保証し、内部の値は変更できる。

まとめ

• let は先に宣言して後から代入できるが、const は直ちに代入しないとエラーになる
• const の単純型は宣言後に変更できない。複雑な型（配列、オブジェクトなど）ではポインターの指すアドレスは変更できないが、内部データは変更できる。