ES6
代码在浏览器环境运行！代码在浏览器环境运行！代码在浏览器环境运行！
我用的google！！！
变量声明 let
最最最基本用法
1
2
| let a = 11;
alert(a); // 11
|
let与var的区别
1
2
3
4
5
| //声明后未初始化,输出相同.
var a;
let b;
console.log(a); // undefined
console.log(b); // undefined
|
使用在声明前的异同
1
2
3
4
5
| console.log(a); //输出undefined ==> 变量提升
var a= 'test var';
console.log(b); //直接报错：ReferenceError: b is not defined
let b = 'test let';
|
重复声明问题 在相同的函数或块作用域内重新声明同一个变量会引发SyntaxError
1
2
3
4
5
6
7
| var a =5;
var a =12;
console.log(a);//必须注释下面的其中一个let声明
let b = 3;
let b = 666; //报错 Identifier 'b' has already been declared
console.log(b)
|
作用域问题
除了全局作用域和函数作用域,es6新增了块级作用域，即用{ }包裹的代码块。
块级作用域
内层变量和外层变量的值互不影响。内层无法读取外层，外层无法读取内层。
作用域问题
问题1： 如果是let声明的初始化表达式 在for循环外 访问i会报错 如果var声明的就不会报错
1
2
3
4
5
| for(let i=0; i<10; i++){
}
//报错
alert(i);
|
问题2： 如果是let声明的初始化表达式 在for循环外 访问i会报错 如果var声明的就不会报错
1
2
3
4
5
6
7
| {
console.log(a); //报错
{let a=12;}
console.log(a) //报错
}
|
问题3： 事件中的索引问题 ==>简化内部函数代码
工作原理是因为（匿名）内部函数的3个实例引用了变量i的3个不同实例。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
| <body>
<script>
var aBtn=document.querySelectorAll('input');
for(let i=0; i<aBtn.length; i++){
aBtn[i].onclick=function(){
alert(i); //弹出对应的 索引
//如果换成var声明 就会弹出 aBtn.length ==> 3
};
}
</script>
</head>
<body>
<input type="button" value="aaa">
<input type="button" value="bbb">
<input type="button" value="ccc">
</body>
|
问题4：在程序或者函数的顶层，let并不会像var一样在全局对象上创造一个属性
1
2
3
4
| var x = 'global';
let y = 'global';
console.log(this.x); // "global"
console.log(this.y); // undefined
|
const 常量
特性
- 声明时就需要赋值，否则报错；一旦声明不可重新赋值，否则报错；
- 块级作用域
- 不存在变量提升；
- 存在暂时性死区；
- 声明引用类型常量时，const保存的是地址，常量中的属性还是可以变的；
块级作用域
1
2
3
4
5
| if(true){
const a=12;
}
//报错 常量的作用域
alert(a);
|
重复赋值
1
2
3
| const a=12;
a=5;
alert(a); // TypeError:Assignment to constant variable.
|
未初始化就使用
1
2
| const a;
alert(a); // Uncaught SyntaxError: Missing initializer in const declaration
|