JavaScript三大变量声明详析
在JavaScript中,我们经常需要声明变量来存储和操作数据。常见的变量声明有三种:var
、let
和const
。本文将详细讲解这三种变量声明的特点和使用方法。
var
var
是ES5标准引入的变量声明关键字。使用var
声明的变量拥有函数作用域(function scope),即在函数中声明的变量只在该函数内部有效。如果在函数外部调用var
声明的变量,会得到undefined
的结果。
function foo() {
var a = 1;
}
foo();
console.log(a); // 报错:a未定义
var
的特性还包括声明提升(hoisting),即在函数内部无论在哪里声明var
变量,该变量都会被视为在函数作用域顶部声明,因此可以在声明前使用该变量。
function foo() {
console.log(a); // 输出undefined
var a = 1;
}
foo();
值得注意的是,在var
声明的变量在声明前访问时,会返回undefined
,这是因为在声明前该变量已经存在,但是还未被赋值。所以,虽然变量声明会被提升,但是赋值操作仍然是按照代码中出现的先后顺序执行的。
let
let
是ES6标准引入的块级作用域(block scope)变量声明关键字。块级作用域指的是在代码块(由花括号包裹的语句序列)内部声明的变量,只在该代码块内有效。与var
不同的是,let
不存在声明提升,所以必须先声明再使用,否则会抛出ReferenceError
错误。
function foo() {
console.log(a); // 报错:a未定义
let a = 1;
}
foo();
let
变量还有一个非常重要的特性,就是允许在同一作用域内重复声明变量。这是因为每次声明的let
变量都是一个新的变量,不会影响前面已经声明的同名变量。
function foo() {
let a = 1;
let a = 2; // 合法
console.log(a); // 输出2
}
foo();
但是,在let
声明变量前访问该变量,同样会抛出ReferenceError
错误,这与var
是一致的。
const
const
也是ES6标准引入的块级作用域变量声明关键字。与let
类似,const
声明的变量也是块级作用域的,不存在声明提升的情况。但是,与let
和var
不同的是,const
是一个常量,一旦声明就不能更改其值。
function foo() {
const a = 1;
a = 2; // 报错:Assignment to constant variable.
}
foo();
但是,如果使用const
声明的变量是一个对象或数组,虽然不能对该变量重新赋值,但是可以修改该变量所引用的对象或数组的属性或元素。
function foo() {
const obj = { a: 1 };
obj.b = 2; // 合法
console.log(obj); // 输出{ a: 1, b: 2 }
}
foo();
示例1
for (var i = 0; i < 5; i++) {
setTimeout(function() {
console.log(i);
}, 1000);
}
在上面的示例中,使用var
声明的i
变量拥有函数作用域,即在整个for
循环中只有一个变量i
,循环中定义的多个setTimeout
共享同一个i
变量。由于setTimeout
是一个异步函数,代码执行到setTimeout
时,for
循环已经结束,此时i
的值为5。因此,无论循环执行了多少次,最终输出的结果都是5。
for (let i = 0; i < 5; i++) {
setTimeout(function() {
console.log(i);
}, 1000);
}
在上面的示例中,使用let
声明的i
变量拥有块级作用域,循环中定义的多个setTimeout
都有各自的i
变量。同时,由于let
不存在声明提升,所以各个setTimeout
函数在执行时,所引用的i
变量都能正确地取到循环迭代中的当前值。因此,输出的结果是0、1、2、3、4。
示例2
const obj = { a: 1 };
obj.b = 2;
console.log(obj); // 输出{ a: 1, b: 2 }
obj = { c: 3 }; // 报错:Assignment to constant variable.
在上面的示例中,首先使用const
声明了一个对象obj
,然后修改了该对象的属性值,但是并没有对该变量重新赋值。这是合法的,因为const
只是保证变量所引用的对象不会改变,而不是保证该对象的属性不能被修改。
然后,尝试对obj
重新赋值,会得到一个Assignment to constant variable
错误。这是因为const
声明的变量是一个常量,一旦声明就不能更改其值。
本站文章如无特殊说明,均为本站原创,如若转载,请注明出处:JavaScript三大变量声明详析 - Python技术站