var 、let 、const 的区别

在JS中,最初声明变量的关键字只有 var,但ES6引入了const let 从而引入了块作用域的概念,使JS的内容更为丰富,那么var const let这三者的区别是什么呢?

作用域

var 适用于需要全局或函数作用域的场景,而 letconst 更适合需要块级作用域的场景。 (var 声明的变量存在变量提升的问题,可能导致意外的行为;而 let 和 const 避免了这个问题,但 let 在暂时性死区内引用变量会导致错误,需要特别注意。)

var 的基本特性与用法

全局作用域与函数作用域:使用 var 声明的变量具有函数作用域或全局作用域,这意味着它们在声明它们的函数或全局执行上下文中是可访问的。如果在函数内部声明了一个 var 变量,那么它在函数外部是不可见的。

变量提升:var 声明的变量会被提升(hoisted)到其作用域的顶部,但变量的赋值不会提升。这意味着你可以在声明之前引用变量(得到 undefined),但不能在声明之前对变量进行赋值操作(会导致错误)。

js 复制代码
function test() {
  console.log(a) // undefined
  var a = 1
}

let 的引入与特点

块级作用域:let 是 ES6(ECMAScript 2015)中引入的,它声明的变量具有块级作用域,即它们只在其所在的块(由 {} 包围的代码块)内有效。这解决了 var 带来的某些作用域问题,如循环中的变量泄露等。

不存在变量提升导致的暂时性死区:虽然 let 声明的变量也会被提升,但它们不会被初始化。在变量被声明之前的区域被称为暂时性死区(Temporal Dead Zone),在这个区域内引用变量会导致 ReferenceError。

js 复制代码
function test() {
  console.log(a) // Uncaught ReferenceError: Cannot access 'a' before initialization
  let a = 1
}
 

const 的定义与限制

常量声明:const 也是 ES6 中引入的,用于声明常量。常量是指一旦声明,其值就不能被改变的变量。需要注意的是,const 声明的变量的值不能改变,但这并不意味着它指向的对象或数组的内容不能改变(对于对象或数组,const 保证的是引用不变)。

必须初始化:与 varlet 不同,const 声明的变量必须在声明时立即初始化,否则会导致语法错误。

js 复制代码
function test() {
 const a // Uncaught SyntaxError: Missing initializer in const declaration
}

可变性与不可变性:

varlet 声明的变量是可变的,而 constÏ 声明的变量是不可变的(但引用对象或数组的内容可以改变)。这使得 const 在声明不需要改变的值时非常有用,可以提高代码的可读性和可维护性。

js 复制代码
function(){
 var a = 1;
 let b = 1;
 const c = 1;
 
 a = 2; // 2
 b = 2; // 2
 c = 2; // Uncaught TypeError: Assignment to constant variable.
}
相关推荐
巴巴博一21 小时前
2026 最新:Trae / Cursor 一键接入 taste-skill 完整教程(让 AI 前端告别“AI 味”)
前端·ai·ai编程
kyriewen21 小时前
半夜三点线上崩了,AI替我背了锅——用AI排错,五分钟定位三年老bug
前端·javascript·ai编程
kyriewen21 小时前
我让 AI 当了 24 小时全年无休的“毒舌考官”
前端·ci/cd·ai编程
hexu_blog21 小时前
vue+java实现图片批量压缩
java·前端·vue.js
IT_陈寒1 天前
为什么你应该学习JavaScript?
前端·人工智能·后端
lifejump1 天前
Empire(帝国)CMS 7.5 XSS注入
前端·安全·xss
无风听海1 天前
OAuth 2.0 前端通道与后端通道深入剖析
前端·oauth
sakiko_1 天前
UIKit学习笔记8-发送照片、拍摄照片并发送
前端·swift·uikit
_code_bear_1 天前
OpenSpec CLI 与 OPSX 工作流说明
前端·后端·架构