JS 变量声明：var, let 和 const 的妙用

2023-12-29 18:33:48

JavaScript中的变量声明

在JavaScript中，声明变量有三种方式：var、let和const。这三种声明方式各有不同的作用域和生存周期，在不同的场景下使用它们可以带来不同的效果。

var 声明变量

var 是JavaScript中最早的变量声明方式，也是使用最广泛的一种。var声明的变量具有函数级作用域，这意味着它们的作用域仅限于声明它们的函数内部。

function example() {
  var x = 10;
  console.log(x); // 10
}

example();

console.log(x); // ReferenceError: x is not defined

在这个例子中，变量x是在函数example内部声明的，因此它的作用域仅限于该函数内部。在函数外，变量x是不存在的，因此尝试访问它会引发ReferenceError。

let 声明变量

let是JavaScript中新引入的变量声明方式，它与var有很大的不同。let声明的变量具有块级作用域，这意味着它们的作用域仅限于声明它们的代码块内部，包括函数内部、循环体内和条件语句体内。

function example() {
  let x = 10;
  if (true) {
    let y = 20;
    console.log(x); // 10
    console.log(y); // 20
  }

  console.log(x); // 10
  console.log(y); // ReferenceError: y is not defined
}

example();

在这个例子中，变量x是在函数example内部声明的，它的作用域仅限于该函数内部。变量y是在if代码块内部声明的，它的作用域仅限于该代码块内部。在代码块外，变量y是不存在的，因此尝试访问它会引发ReferenceError。

const 声明变量

const是JavaScript中用于声明常量的变量声明方式。const声明的变量的值一旦被赋值，就不能再被修改。const声明的变量具有块级作用域，与let相同。

function example() {
  const x = 10;
  if (true) {
    const y = 20;
    console.log(x); // 10
    console.log(y); // 20
  }

  console.log(x); // 10
  console.log(y); // ReferenceError: y is not defined
}

example();

var、let和const的区别

var、let和const都是用来声明变量的，但它们在作用域、生存周期和可修改性方面存在着差异。

特征	var	let	const
作用域	函数级	块级	块级
生存周期	整个函数	声明所在的代码块	声明所在的代码块
可修改性	可修改	可修改	不可修改

什么时候使用var、let和const？

var、let和const都有各自的适用场景，在不同的场景下使用它们可以带来不同的效果。

var ：var通常用于声明全局变量或函数内部的局部变量。由于var具有函数级作用域，因此在函数内部声明的var变量可以在函数的任何地方访问，包括嵌套函数内部。
let ：let通常用于声明块级作用域的变量。let声明的变量只能在声明它们的代码块内部访问，包括嵌套代码块内部。这可以帮助我们避免在代码中创建不必要的全局变量或函数级变量，从而提高代码的可维护性。
const ：const通常用于声明常量，即值一旦被赋值后就不能再被修改的变量。const声明的变量只能在声明它们的代码块内部访问，包括嵌套代码块内部。这可以帮助我们确保代码中某些变量的值不会被意外修改，从而提高代码的健壮性。