浅谈JS中 var let const 变量声明
浅谈js中 var let const 变量声明
用var来声明变量会出现的问题:
1. 允许重复的变量声明:导致数据被覆盖
2. 变量提升:怪异的数据访问、闭包问题
3. 全局变量挂载到全局对象:全局对象成员污染问题
例1:
用var声明的变量会默认被提升到当前作用域的顶部
例2:
for循环内的i变量当前所处的环境是全局作用域(函数局部作用域同理,只不过声明之后不绑定在window上)。
所以在最后点击事件触发的时候打印的i都是当前作用域上的同一个i,也即是最后的11
,这就产生了闭包,如下图
es6 中引入let 和 const,以及块级作用域来解决这个问题
什么是块级作用域
块级作用域:代码执行时遇到花括号,会创建一个块级作用域,花括号结束,销毁块级作用域
let在全局作用域下定义变量不会挂在到顶层对象window上
let声明的变量,不允许当前作用域范围内重复声明,在块级作用域中用let定义的变量,在作用域外不能访问
let不会有变量提升,因此,不能在定义let变量之前使用它
例1(对比):
为什么会出现error,因为在let和const中引入了一个暂存该类变量的区域temporal dead zone,简称tdz。就是我们所说的临时死区。
在tdz中的变量不能被访问,不然就会报错,只有在给该变量赋值的时候才会从死区内接触。
问题:let和const申明的变量真的不被提升吗?
let声明的变量实际上也会有提升,但是,提升后会将其放入到“暂时性死区”,如果访问的变量位于暂时性死区,则会报错:“cannot access 'a' before initialization”。当代码运行到该变量的声明语句时,会将其从暂时性死区中移除。
例2(对比):
轻松解决闭包问题
但是我们看到,此时for循环内()中的let i并不在块级作用域内,讲道理应该最后点击时,打印的应该是这个全局上的i。这个i最后是11,可是从结果上来看却不是这样。
在全局上打印这个i
说明这个for循环()内的i并不是定义在全局作用域上的
原因:
对于for循环()内let定义的变量,做了特殊的处理。此变量相当于默认声明在后面块级作用域内
const
const 和let特性相同,唯一不同的是,const一般指的都是常量,常量的定义是不可改变的变量,所以用const 申明的变量是不可变的,且只能在定义是进行赋值。
值得注意的是const声明的常量是指存入内存的内存空间不可变。这也就意味着,如果存的是引用值,改变引用值内的属性,const所对应的值就会改变
通常在开发中能写const就用const,不行就用let,这样出bug率小
每天学习每日进步,不断累积。大佬们说过,只会api的前端不是一个好的工程师。