让JS变量更清晰易用：var、let和const的区别

前端

2024-01-28 22:26:55

在JavaScript中，我们有三种方法来声明变量：var、let和const。虽然它们看起来很相似，但它们在作用域、提升和赋值规则方面有很大差异。理解这些差异对于编写清晰、易于理解的代码非常重要。

1. 作用域

变量的作用域是指它可以在程序的哪些部分被访问。

var ：var声明的变量具有全局作用域或函数作用域。这意味着它们可以在声明它们的块或函数内以及这些块或函数之外被访问。
let ：let声明的变量具有块级作用域。这意味着它们只能在声明它们的块内被访问。
const ：const声明的变量具有块级作用域。这意味着它们只能在声明它们的块内被访问。

2. 提升

变量的提升是指在代码执行之前，它被移动到其声明的顶部。

var ：var声明的变量会被提升到其所在函数或全局作用域的顶部。
let ：let声明的变量不会被提升。
const ：const声明的变量不会被提升。

3. 赋值

变量的赋值是指给它一个值。

var ：var声明的变量可以被多次赋值。
let ：let声明的变量只能被赋值一次。
const ：const声明的变量只能被赋值一次。

总结

特性	var	let	const
作用域	全局或函数	块级	块级
提升	是	否	否
赋值	可以多次赋值	只可赋值一次	只可赋值一次

何时使用var、let和const

var ：当你想创建一个全局变量或一个在整个函数中都可以访问的变量时，可以使用var。
let ：当你想创建一个只在声明它的块内可访问的变量时，可以使用let。
const ：当你想创建一个只读变量时，可以使用const。

示例

// 全局变量
var globalVar = 10;

// 函数作用域变量
function myFunction() {
  var functionVar = 20;
}

// 块级作用域变量
if (true) {
  let blockVar = 30;
}

// 常量
const PI = 3.14;

console.log(globalVar); // 10
console.log(functionVar); // 20
console.log(blockVar); // ReferenceError: blockVar is not defined
console.log(PI); // 3.14