ES6声明(let var const的区别)

2023-11-08 23:24:31

在ES6中，引入了三种新的声明类型：let、const和var。这些声明类型在使用方式和作用域上都有所不同，因此了解它们的差异非常重要。

var

var是JavaScript中最古老的声明类型。它可以用来声明变量，并且可以在任何地方使用，包括函数内部和外部。var声明的变量具有函数作用域，这意味着它们可以在声明它们的函数中以及该函数的所有子函数中使用。

function foo() {
  var x = 10;

  function bar() {
    console.log(x); // 10
  }

  bar();
}

foo();

var变量的一个重要特性是提升（hoisting）。这意味着var声明的变量会在代码执行之前提升到函数的顶部。因此，即使你将var变量声明放在函数的中间，你也可以在函数的任何地方使用它。

function foo() {
  console.log(x); // undefined

  var x = 10;
}

foo();

let

let是ES6中引入的一种新的声明类型。它与var非常相似，但也有几个关键的区别。首先，let声明的变量具有块级作用域，这意味着它们只能在声明它们的代码块中使用。

function foo() {
  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
}

foo();

其次，let声明的变量不能重复声明。这意味着你不能在同一个代码块中多次声明同一个变量。

function foo() {
  let x = 10;
  let x = 20; // SyntaxError: Identifier 'x' has already been declared
}

foo();

最后，let声明的变量存在暂时死区（temporal dead zone）。这意味着在let声明的变量被初始化之前，你不能使用它。

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

  let x = 10;
}

foo();

const

const是ES6中引入的另一种新的声明类型。它与let非常相似，但也有一个关键的区别：const声明的变量是不可变的，这意味着你不能重新赋值给它。

const x = 10;
x = 20; // TypeError: Assignment to constant variable.

const声明的变量具有块级作用域和暂时死区，与let声明的变量相同。

总结

下表总结了let, var和const声明类型的主要区别：

特性	var	let	const
作用域	函数作用域	块级作用域	块级作用域
提升	是	否	否
重复声明	可以	不可以	不可以
暂时死区	否	是	是
可变性	可变	不可变	不可变