// var let const 区别
// ES5 只有全局作用域和函数作用域，没有块级作用域，这带来很多不合理的场景，
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>var</title>
<script>
window.onload = function(){
var aLi = document.getElementsByTagName('li');
for (var i=0;i<aLi.length;i++){ /*将var改为let*/
aLi[i].onclick = function(){
alert(i); /*单击任何标签都输出4*/
}
}
}
</script>
</head>
<body>
<ul>
<li>0</li>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</body>
</html>
// 在ES6之前，大部分人会选择使用闭包来解决这个问题，今天我们使用ES6提供的let来解决这个问题。
// 1.0 var声明的变量会挂在window上，而let和const不会
var a=100
console.log(a,window.a) //100 100
let b=100
console.log(b,window.b) // 100 undefined
const c = 1;
console.log(c,window.c); // 1 undefined
// 2.0 var声明的变量存在变量提示，let和const不存在变量提示
console.log(d); // undefined (d已声明还没赋值，默认得到undefined值)
var d = 100;
console.log(e); // 报错：Uncaught ReferenceError: Cannot access 'e' before initialization
let e = 10;
console.log(f); // 报错：Uncaught ReferenceError: Cannot access 'e' before initialization
const f = 10;
// 3.0 let和const声明形成块级作用域
if(true){
var g=100;
let h=10;
const i=10;
}
console.log(g) //100
console.log(h) //Uncaught ReferenceError: h is not defined
console.log(i) //Uncaught ReferenceError: i is not defined
//4.0 同一作用域下let和const不能声明同名变量，而var可以
var a1 = 100;
console.log(a); // 100
var a2 = 10;
console.log(a); // 10
let a3 = 100;
let a3 = 10;
// 5.0 暂存死区
var a4=100;
if(1){
//在当前块作用域中存在a使用let/const声明的情况下，给a赋值10时，只会在当前作用域找变量a，
// 而这时，还未到声明时候，所以控制台Error:a is not defined
a4=10;
let a4=1;
}
// 6.0const
// 1、一旦声明必须赋值,
// 2、声明后不能再修改
// 3、如果声明的是复合类型数据，可以修改其属性
const a5 = 100;
const list = [];
list[0] = 10;
console.log(list); // [10]
const obj = {a:100};
obj.name = 'apple';
obj.a = 10000;
console.log(obj); // {a:10000,name:'apple'}