es6（一）——var和let和const的区别

---

1:var 和 let的区别

相同点：都是用来声明变量的
主要区别：
（1）：不存在变量提升（var定义的变量在js从上至下执行的时候，会把var定义的变量，先解析且定义的变量值为undefined，而let不会）
（2）：let为块级作用域，而var是全局/局部作用域（简单来说就是var和let同样在if判断或者for循环的{}里面，let在{}之外获取不到，而var可以）
（3）：不允许重复声明 (let不允许在相同作用域内，重复声明同一个变量，而var可以，效果是重复赋值)
（4）：for循环中var和let定义的变量执行原理和执行效果不同
划重点：（经典面试题）
①在es5的时候，要想在var定义的for循环中，使用定时器遍历数据，直接获取到0-9的数据是不行的，如下代码

for (var i = 0; i < 10; i++) {
 setTimeout(()=>{
    console.log('i', i); // 输出 10 个 10
  },500)
}

②：在①的基础上，直接不能获取，可以间接获取0-9的值，那就是使用闭包，如下代码

 for (var i=0; i < 10; i++) {
   (function (j){
     setTimeout(()=>{
       console.log('i', j);
   	 },500)
   })(i)
}

③：es6中可以直接使用let来获取效果，如下代码

 for (let i = 0; i < 10; i++) {
   setTimeout(()=>{
     console.log('i', i);
   })
}

简单说下执行过程：
①for循环中，var是由于预解析的原因（就你在for循环前面打印一下i，你会发现没有报错，然后打印出来的是undefined）导致会出现一个全局变量i。
②定时器属于异步操作,会被放在异步队列中最后执行。
③所以实际上在定时器中，当循环往下走时i也在不断的进行++，表面上遍历了10次，对于电脑的运行机制来说是很快的，这个时候打印的已经是最大值10了。
④输出10个10。

2:let和const的区别

（1）区别：

①const的作用域与let命令相同：只在声明所在的块级作用域内有效。
②const命令声明的常量也是不提升，同样存在暂时性死区，只能在声明的位置后面使用。
③const声明的常量，也与let一样不可重复声明。
④const定义的变量，不能重复赋值。
换句话说，var和const的区别加上const定义的变量存储数据不能被改变并去掉for循环中var和let定义的变量执行原理和执行效果不同即可，这也很好理解，毕竟for循环中也不能用const定义，因为重复赋值会报错嘛。

（2）：const的其他注意点：对于const来说，只声明不赋值，就会报错。

（3）：const的本质

const foo = {};

// 为 foo 添加一个属性，可以成功
foo.prop = 123;
foo.prop // 123

foo = {};// 将 foo 指向另一个对象，就会报错

本质：const实际上保证的，并不是变量的值不得改动，而是变量指向的那个内存地址所保存的数据不得改动。对于简单类型的数据（数值、字符串、布尔值），值就保存在变量指向的那个内存地址，因此等同于常量。但对于复合类型的数据（主要是对象和数组），变量指向的内存地址，保存的只是一个指向实际数据的指针，const只能保证这个指针是固定的（即总是指向另一个固定的地址），至于它指向的数据结构是不是可变的，就完全不能控制了。

参考文章：https://es6.ruanyifeng.com/#docs/let