【JavaScript】var letとconstの違い

1.var
var:JS変数を宣言します.
値を持たない変数は、デフォルトはundefinedです.
es 2015導入:letとconstは、JSにブロックスコープと定数を提供する.
2.let:
同じ点:変数を宣言して、関数のスコープ、大域のスコープでvarと通用することができます.
違い点:
1)循環作用域
var ループ外の変数を再宣言し、let ありません

var i = 7;
for (var i = 0; i < 10; i++) {//             i
  //     
}
//   ，i   10

let i = 7;
for (let i = 0; i < 10; i++) {//             i
  //     
}
//    i   7

2)HTMLにおけるグローバル変数

var carName = "porsche"; //         window   ：
let carName = "porsche"; //     window   ：

3)改めて声明する
var:プログラムのどの位置でもJS変数を再宣言することができます.
let:同じスコープまたはブロックにおいて、一つのvarまたはlet変数を再宣言することも、varを通じて一つのlet変数を再宣言することも許されない.異なる作用領域またはブロックにおいてのみ、変数をletで再宣言することができます.

//var   
var x = 10;//   ，x   10
var x = 6; //   ，x   6

//          ，      let        var   let   
//       var        let   
var x = 10;       //   
let x = 6;       //    

{
  var x = 10;   //   
  let x = 6;   //    
}

//          ，   let           ：
let x = 6;       //   

{
  let x = 7;   //   
}

4)変数の昇格
通過する var 宣言された変数は一番上に移動します.letとconstはできません.声明の前では使えません.

//    ，      carName
var carName;

3.const:
1)宣言時に値を賦課しなければならず、また新たに値を賦与することはできない.
2)ブロックのスコープ内で再宣言しない.

var x = 10;
//   ，x   10
{ 
  const x = 6;
  //   ，x   6
}
//   ，x   10

3)オブジェクトの定数値が定義されていません.値に対する定数参照が定義されています.したがって、定数オブジェクトの属性は変更できますが、定数の元の値は変更できません.

//      const   ：
const car = {type:"porsche", model:"911", color:"Black"};
//       ：
car.color = "White";
//           ：
car = {type:"Volvo", model:"XC60", color:"White"};    // ERROR

4)定数配列は変更できます.

const cars = ["Audi", "BMW", "porsche"];

//     ：
cars[0] = "Honda";

//     ：
cars.push("Volvo");

5)改めて声明する
同じスコープは許可されていません.

//          ，   let           ：
let x = 6;       //   

{
  let x = 7;   //   
}

 
ヽoo.....................................................
グローバルスコープ:関数以外で宣言された変数は、JSプログラムのどこにでもアクセスできます.
関数のスコープ:関数内で宣言された変数は、宣言された関数内でのみアクセスできます.
ブロック作用領域:ブロック{}内で宣言された変数は、let宣言を使用してブロック外からアクセスできません. 
萼向上(Hoisting)
関数宣言と変数宣言は、常にインタプリタによって方法体の最上部に“昇格”されます.
scriptタグに出会うとjsは事前解析を行い、変数varとfunction声明をアップグレードしますが、functionは実行されません.varとfunctionがない限り、コンテキストを実行します.
宣言された変数だけが向上し、初期化されません.

var x = 5; //     x

elem = document.getElementById("demo"); //     
elem.innerHTML = x + " " + y;           //    x   undefined

var y = 7; //     y