一、块级绑定
大多数类C语言中,变量(或绑定)总是在它被声明的地方创建。然而JS就不是这样,变量实际创建的位置取决于你如何声明它,而在ES6中提供了块级绑定以便你能更轻易地控制变量的作用域。
ES6向类C语言的风格靠近了
1.1 var声明与变量提升
使用var关键字声明的变量,无论其实际声明位置在何处,都会被视为声明于所在函数的顶部(如果声明不在任意函数内,则视为在全局作用域的顶部)。这就是所谓的变量提升。
参考如下函数定义了解变量提升的含义
function getValue(codition){
if(codition) {
var value = 'blue'
// 其他代码
return value
} else {
// value 在此处可访问,值为undefined
return null;
}
// value在此处可访问,值为undefined
}
如上代码,value无论如何都会被创建,JS引擎在后台对getValue函数进行了调整如下:
function getValue(codition){
var value;
if(codition){
value = "blue"
// 其他代码
return value
} else {
return null
}
}
value变量的声明被提升到了顶部,而初始化的工作则保留在原处。这意味着在else分支内value变量也是可访问的,此处它的值是undefined,因为它并没有被初始化。
var变量提升不熟悉可能导致bug,正因为如此,ES6引入了块级作用域,让变量的生命周期更加可控。
1.2 块级声明
块级声明也就是让所声明的变量在指定块的作用域外无法被访问。块级作用域(又被称为词法作用域)在如下情况被创建:
- 在一个函数内部
- 在一个代码块(由一对花括号包裹)内部
1.2.1 let声明
let声明的语法与var的语法一致。你基本可以使用let来代替var进行变量声明,但是会将变量的作用域限制在当前代码块中。由于let声明并不会被提升到当前代码块的顶部,因此你需要手动将let声明放置到顶部,以便 让变量在整个代码块内可用。
function getValue(codition){
if(condition){
let value = 'blue'
// 其他代码
return value
} else {
// value 在此处不可用
return null
}
// value在此处不可用
1.2.2 禁止重复声明
如果一个标识符已经在代码块内部被定义,那此在此代码块内使用同一个标识符进行let声明会导致抛出错误如:
var count = 30;
// 语法错误
let count = 40;
在嵌套的作用域内使用let声明一个同名的新变量,则不会抛出错误.
var count = 30
// 不会抛出错误
if(condition){
let count = 40
// 其他代码
}
1.2.3 常量声明
在ES6中也可以使用const语法进行声明。使用const声明的变量会被认为是常量,意味着它们的值在被设置完成后就不能再被改变。正因为如此,所有的const变量都需要在声明时进行初始化,示例如下:
// 有效的常量
const maxItems = 30
// 语法错误:未进行初始化
const name
常量声明与let声明一样,都是块级声明。
1.2.4 使用const声明对象
const声明会阻止对于变量绑定与变量自身值的修改,这意味着const声明并不会阻止对变量成员的修改。如下例:
const Person = { name: 'Maco' }
// 正常
Person.name = 'Jeery'
// 抛出错误
Person = { name: 'Jerry' }
const阻止的是对于变量绑定的修改,而不阻止对成员值的修改。
二、总结
变量值需要被更改的情况下才使用let。其理论依据是大部分变量在初始化之后都不应当被修改,因为预期外的改动是bug的源头之一。