关于es6的变量声明新增了let,const的声明方式
因为原本的js的var声明方式太过随意,会有很多不合理的地方,比如
1.可以重复声明
2.无法限制修改
3.没有块级作用域
4.变量提升
这些问题在正常项目开发的时候会造成很多隐藏的bug,而es6中的新增的let和const声明方式就可以解决这些问题
let 不能重复声明 变量可以修改 块级作用域
const 不能重复声明 常量不可以修改 块级作用域
首先我们查看第一个特性,不能重复声明
let a = 5
let a = 'hello world'
//这个时候就可以看到浏览器就直接报错了
在声明方面,const的是不仅仅不允许重复声明,而且不允许修改值,我们可以看作赋值了一个常量
const a = 1;
a = 'hello wolrd'
当然,这个时候浏览器也会报错
但是如果const赋值的是一个对象或者数组的话,我们可以使用数组的方法和对象的方法去修改这个常量,但是不能直接赋值修改
条件虽然严格了一点,但是他的用法更加好用了,比如说我有以下的需求
//点击每个button出现了对应的编号
<button>1</button>
<button>2</button>
<button>3</button>
<button>4</button>
<button>5</button>
<script>
var btn = document.querySelectorAll('button')
for(var i = 0 ; i<button.length;i++){
btn[i].onclick = function(){
console.log(i)
}
}
</script>
//这个时候我们控制台打印无论你点击的是哪个button,打印的肯定是4
这个时候如果我们想实现需求必须
for(var i = 0 ; i<button.length;i++){
(function(i){
btn[i].onclick = function(){
console.log(i)
}
})(i)
}
这样写太过麻烦,我们可以使用let命名来解决这个问题
for(let i = 0 ; i<button.length;i++){
btn[i].onclick = function(){
console.log(i)
}
//这样就可以满足我们的需求了
上面解决的就是我们说的块级作用域的问题,在带有{}中我们都可以把他看作一个块级作用域,在这个作用域里面,i的值只能被内部获取,不能被外部获取
网友评论