var 、let 、const 的区别

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

作用域

var 适用于需要全局或函数作用域的场景,而 let 和 const 更适合需要块级作用域的场景。 (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 保证的是引用不变)。

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

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

可变性与不可变性:

var 和 let 声明的变量是可变的,而 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.
}
相关推荐
卸任11 小时前
Vibe coding工具使用心得
前端·ai编程
brien912 小时前
为什么模型标称 1M,Google Antigravity 聊到 256K 却突然失忆?我们给它做了个原生行内监控圆环
前端
修炼的dance12 小时前
录屏关键帧间隔多少合适?六档实测,2秒到10秒小了75.6%
前端
Lank_M12 小时前
关键帧从1秒拉到10秒,录屏小87.3%,摄像头小10.8%
前端
补码缩写12 小时前
用 ffprobe 拆录屏,八成字节在 29 个关键帧上
前端
百思不得小李12 小时前
一个复杂的动态表单是如何实现的
前端·设计模式
陈随易12 小时前
Cmder 停更 17 个月,2.0 支持 Windows Terminal
前端·后端·程序员
清晨Coding13 小时前
删了 Cookie 还能自动登录?Google系网站登录态自动恢复的原理分析
javascript
风骏时光牛马13 小时前
前沿视界
前端
kyriewen13 小时前
我扫了 814 个依赖,97 个还敢要 Node 10
前端·javascript·程序员