标签： javascript
var定义变量面临的问题
- 可以重复定义
- 无法限制变量不可修改
- 无块级作用域
ES6变量定义升级
- 新增let定义变量
- 新增const定义常量
let特性
- 有块级作用域
- 不可重复定义
const特性
- 有块级作用域
- 不可重复定义
- 不可修改
解决的痛点
example1 :
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
</head>
<body>
<input type="button" value="1">
<input type="button" value="2">
<input type="button" value="3">
<script>
/*
*如下代码如果想做到点击每个按钮弹出当前按钮的索引，
*用var的话要么就是通过自定义属性，或者用一个自执行函数创造一个作用域
*但是你把var i=0换成let i=0就能很好的实现你所想要的
*/
var btnList = document.getElementsByTagName('input');
var len = btnList.length;
for(var i=0;i<len;i++){//(var let =0;i<len;i++)
btnList[i].onclick = function(){
alert(i);
}
}
</script>
</body>
</html>
example2:
/*
*在做复杂项目的时候经常会因为重复定义变量导致莫名BUG，
*但是当你如果把如下代码var换成let来定义，你将会发现控制台会丢给你一个大大的变量
*已定义的错SyntaxError: Identifier 'a' has already been declared
*/
var a = 1;
var a = 2;
alert(a);
example3
/*
*当前想固定一个变量为不可变值时，以前是无法实现的
*但是现在通过const定义的常量如果你再去修改会在控制台报一大错
*/
const PI = 3.1415926;
PI = 'aaa';
alert(PI);