var和let的区别

知识问答 2025-09-01 15:45:48 来源:互联网

varlet是JavaScript中两种声明变量的关键字,它们之间的主要区别在于作用域、变量提升(hoisting)以及是否可重复赋值。

1、作用域:var声明的变量具有函数级作用域,即在函数内部使用var声明的变量可以在整个函数内访问;而let声明的变量具有块级作用域,即在同一个代码块(如if语句、循环等)内使用let声明的变量可以访问,但在其他代码块内无法访问。

function example() {  if (true) {    var x = 10; // 在if语句内部声明的变量x具有函数级作用域  }  let y = 20; // 在if语句内部声明的变量y具有块级作用域  if (false) {    let y = 30; // 在另一个if语句内部声明的变量y具有块级作用域,与外部的y同名,但不会覆盖外部的y  }}example();console.log(x); // 输出undefined,因为x的作用域仅限于if语句内部console.log(y); // 输出30,因为y在不同的if语句内部具有相同的名称,但它们的作用域是独立的

2、变量提升:var声明的变量会在代码执行前进行变量提升(hoisting),即将变量的声明提到作用域链的最顶端;而let声明的变量不会进行变量提升,它们会按照正常的顺序在作用域链中查找。

if (true) {  console.log(x); // undefined,因为x在var声明前就已经被提升到了全局作用域} else {  let x = 10; // 在else语句内部声明的变量x具有块级作用域}console.log(x); // 输出10,因为x在else语句内部被赋值,此时x的作用域为整个代码块

3、可重复赋值:由于var具有函数级作用域,因此在同一个函数内不能对同一个变量使用相同的名字进行多次赋值;而let具有块级作用域,允许在同一个代码块内对同一个变量进行多次赋值。

function example() {  var x = 10; // 不能再次为x赋值,否则会覆盖之前的赋值结果  x = 20; // 可以正常为x赋值,覆盖之前的赋值结果}example(); // x的值为20