ES6新特性-块级绑定
简述:块级绑定是指将变量与块级进行绑定,由此ES6提供了 两个关键字来申明变量 let、const 并且与块级进行绑定
下面我们就来看看ES6为什么要新增let、const关键字
var声明变量存在的问题
在es6以前都是用var进行变量申明的,他存在如下问题
//问题1:允许重复的变量声明:导致数据被覆盖
//问题2:变量提升:怪异的数据访问、闭包问题
//问题3:全局变量挂载到全局对象:全局对象成员污染问题
var name = "小明";
function print(){
console.log(name) //输出:小红
}
//这里有很多代码
var name = "小红"
print() //执行print函数
console.log(window.name)//输出:小红
1.关于重复申明变量 变量被覆盖的问题:有一些变量名实在太常用了,如果先声明name 后期在开发的过程中我们可能会对这个变量进行重复的申明 变量被调用时的值是不稳定的2.关于变量提升的问题:①设计逻辑的缺陷
//如下代码是不报错的
if(false){
var a="abc"
console.log(a)
}else{
console.log(a) //输出undefined
}
//ES官方认为在else 中输出a 应该报错 应该找不到该变量的存在
//但实际上 var将变量进行提升 会解析成如下代码执行
var a;
if(false){
a="abc"
console.log(a)
}else{
console.log(a) //输出undefined
}
②闭包问题
//在页面创建 10个按钮
for (var i = 1; i <=10; i++) {
var btn=document.createElement("button");
btn.innerHTML="按钮"+i;
document.body.appendChild(btn);
btn.onclick=function (){
console.log(i) //输出11
}
}
//当点击任何一个按钮时都会输出11
//这个bug问题 是因为 变量用var取绑定了i的值 浏览器解析成如下代码执行
var i;
for (i = 1; i <=10; i++) {
var btn=document.createElement("button");
btn.innerHTML="按钮"+i;
document.body.appendChild(btn);
btn.onclick=function (){
console.log(i) //输出11
}
}
//此时第一个i和最后一个i实际上是一个变量
//当循环完毕后 这个i变成了11 无论点击哪一个按钮都是11
3.关于全局变量污染的问题:全局变量挂载到全局对象造成全局污染
// 大家都知道 浏览器环境 window对象里面有一个console
//console对象用于控制台打印
//但是我们可以声明var变量 将window对象默认的console对象替换
var console = 100
console.log(console)
//报错console.log is not a function
//最终导致报错,这种替换ES官方认为是不利于开发的,但是如果你想用于hook一些内置的函数是用这种方法是可以的
ES6的解决方案
引入let 和 const 关键字
1.let的特点
★let声明的变量不会挂载到全局对象
★let声明的变量,不允许当前作用域范围内重复声明在块级作用域中用let定义的变量,在作用域外不能访问
★底层实现上,let声明的变量实际上也会有提升,但是,提升后会将其放入到“暂时性死区”,如果访问的变量位于暂时性死区,则会报错:“Cannot access 'a' before initialization”。当代码运行到该变量的声明语句时,会将其从暂时性死区中移除。
★在循环中使用let声明的循环变量,在循环结束后会销毁
let name = "张三" //不会挂在到window对象上
console.log(window.name)
//在循环中 let绑定了每一次循环的块级 即{...}
//所以每一次循环体中 的i是不同的值
for (let i = 1; i <=10; i++) {
var btn=document.createElement("button");
btn.innerHTML="按钮"+i;
document.body.appendChild(btn);
btn.onclick=function (){
console.log(i)
}
}
2.const的特点
★const变量在声明时必须赋值。
★声明后 后续不可对这个变量进行修改 其为常量
★在for循环中,循环变量不可以使用常量
说明:常量不可变,是指声明的常量的内存空间不可变,并不保证内存空间中的地址指向的其他空间不可变。
WilliamKaf
2024-02-11 05:14[url=https://restavratsiyavann.com/mendeleyevsk/]浴缸维修[/url]
PerryBuh
2024-02-10 01:21通过观看新视频轻松赚钱youtube.com https://aviso.bz/?r=filosof20063
SteveaBili
2024-02-09 08:10向新力運動彩券行
https://1688bet.tw/
AlexisVar
2024-01-21 01:30冠天下
https://xn--ghq10gmvi.com/
Rodneycer
2024-01-15 02:07滿天星娛樂城
https://star168.tw/