es6 let和const的用法及注意事项

今天又回顾了一下es6，发现let和const还有很多小细节没有注意到，写一篇文章来记一下。
注意！let和const都只能作用于当前代码块，但也可以作用于当前代码块内部的代码块（即子代码块），只是不能向外延伸。

let

let是定义变量，用法跟var相同，但是只能作用于当前代码块且不能在未定义之前使用（没有变量提升）（对于变量提升不理解的朋友可以去看看 js的预解析机制）。

{
	let a= 2 ;
	var obj = 2 ;
}
console.log(a);   // 报错
console.log(obj);  // 2

原因：let只能作用于当前代码块

console.log(data);   // 报错
let data = 2;

原因：let定义的变量不会发生变量提升

下面是一个经典例题，体现var和let的区别：

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

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

第一种var的情况，由于var是一个全局变量，当执行a[6]()的时候,循环已经结束了，i=10，调用函数返回的结果就是10。
第二种let的情况，由于let只在当前块级作用域有效，每一次循环的i都是一个新的变量。而js引擎会记住上一次循环的值，初始化本轮的i时，是在上一轮的基础上计算，所以返回的结果就是6。

下面这个例子比较特殊，它主要是为了表明 let 可以作为参数传递到另一个代码块中

List()
function List(){
	let list = []
    tree(list)
}
function tree(list){
    list.push(1)
    console.log(list)   // [1]
}

const

const是定义常量，初始化时必须赋值且之后不能对其值进行改变。const定义数组和对象时可使用数组的一些方法，如push,shift等对该值进行操作，但不能直接改变该值。

const data = [1,2,3]
data = [6,6,6]
console.log(data)    // 报错

const data = [1,2,3]
data.push(6)
console.log(data)    //  [1, 2, 3, 6]

在vue中，使用eslint代码规范，在运行时会自动将var转换为const，所以const一般用来定义数组和对象，用let来定义数字及字符串