当我们在 JavaScript 中声明变量时,可以使用三种关键字 var、let 和 const。这些关键字虽然能够完成相同的任务,但它们的含义和用法是不同的。
var关键字
使用 var 关键字,我们可以在 JavaScript 中声明一个变量。它是 ES5 标准中的一部分。var 关键字在声明变量时,会将该变量提升到函数或全局作用域的顶部。这意味着,在声明之前,变量就已经存在了。同时,var 声明的变量在同一个作用域中可以被重复声明,这样会覆盖已有的变量值。
示例
function example() {
var x = 10;
if(true) {
var x = 20;
console.log(x); // 20
}
console.log(x); // 20
}
example();
上面的代码中,我们在函数中通过 var 声明了一个变量 x,并将其值设置为 10。然后,在 if 语句中,我们通过 var 重新声明了一个同名变量 x,并将其值设置为 20。当代码执行到 console.log(x) 时,会输出变量 x 的值,即 20。同时,如果我们在 if 语句的外部再次调用 console.log(x),它仍然会输出 20。这是因为使用 var 声明的变量在整个函数范围内都是可见的。
let 关键字
let 也是 ES6 标准中新增的关键字之一。相比于 var 来说,let 声明的变量的作用域与 var 声明的变量不同。在同一个作用域内,使用 let 声明的变量值不会相互干扰。同时,使用 let 声明变量时,变量只在当前代码块中有效,离开这个代码块后,变量就会销毁。
示例
function example() {
let x = 10;
if(true) {
let x = 20;
console.log(x); // 20
}
console.log(x); // 10
}
example();
上面的代码中,我们在函数中通过 let 声明了一个变量 x,并将其值设置为 10。然后,在 if 语句中,我们通过 let 重新声明了一个同名变量 x,并将其值设置为 20。当代码执行到 console.log(x) 时,会输出变量 x 的值,即 20。但是,当代码执行到 if 语句外部时,调用 console.log(x) 时会输出 10,这是因为外部代码块中的变量 x 不受内部代码块声明的 let 变量影响。
const 关键字
const 也是 ES6 标准中新增的关键字之一。使用 const 关键字,我们可以声明常量,这意味着变量的值在初始化之后不能被修改。和 let 一样,使用 const 声明的变量只在当前代码块中有效。
示例
function example() {
const x = 10;
x = 20; // 抛出 TypeError 异常,因为常量 x 的值不能再次修改
if(true) {
const x = 20;
console.log(x); // 20
}
console.log(x); // 10
}
example();
上面的代码中,我们在函数中通过 const 声明了一个常量 x,并将其值设置为 10。然后,我们试图将常量 x 的值修改为 20,这时就会抛出 TypeError 异常。接着,在 if 语句中,我们通过 const 声明了一个同名常量 x,并将其值设置为 20。当代码执行到 console.log(x) 时,会输出变量 x 的值,即 20。但是,当代码执行到 if 语句外部时,调用 console.log(x) 时会输出 10,这是因为常量 x 的值不能再次修改。
总结来说,var 声明的变量作用于函数或全局作用域中,let 和 const 声明的变量作用于当前代码块中。let 和 const 声明的变量不能被重复声明,而 const 声明的变量的值一旦被设置后不能再次修改。