粗看ES6之变量
Posted !win !
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了粗看ES6之变量相关的知识,希望对你有一定的参考价值。
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);
以上是关于粗看ES6之变量的主要内容,如果未能解决你的问题,请参考以下文章