JavaScript中的变量声明:var、let与const的区别

原创
admin 6个月前 (06-16) 阅读数 32 #JavaScript

变量声明的前世今生

JavaScript中的变量声明经历了从varlet/const的演变,这是ES6带来的重要改进之一。理解这三种声明方式的区别对于编写可靠、可维护的JavaScript代码至关重要。

1. var的局限性

在ES6之前,var是唯一的变量声明方式,但它存在一些明显的问题:

// 变量提升(hoisting)console.log(a); // 输出undefined而不是ReferenceErrorvar a = 10;// 没有块级作用域if (true) {  var b = 20;}console.log(b); // 输出20,变量泄露到了全局

2. let的块级作用域

let解决了var的两大痛点:

// let不存在变量提升console.log(c); // ReferenceError: c is not definedlet c = 30;// let具有块级作用域if (true) {  let d = 40;  console.log(d); // 输出40}console.log(d); // ReferenceError: d is not defined

3. const的常量特性

const用于声明常量,不能被重新赋值,但需要注意它只是保证变量指向的内存地址不变,对于引用类型的内容是可以修改的:

const e = 50;e = 60; // TypeError: Assignment to constant variableconst obj = { name: 'Alice' };obj.name = 'Bob'; // 允许修改属性console.log(obj); // { name: 'Bob' }obj = {}; // TypeError: Assignment to constant variable

4. 暂时性死区(Temporal Dead Zone)

letconst存在暂时性死区,即在声明前访问变量会报错:

function test() {  console.log(f); // ReferenceError  let f = 70;}test();

5. 全局作用域下的声明差异

在全局作用域下,var声明的变量会成为window对象的属性,而letconst不会:

var globalVar = 'var';let globalLet = 'let';console.log(window.globalVar); // 'var'console.log(window.globalLet); // undefined

最佳实践建议

默认使用const,除非确定变量需要被重新赋值需要重新赋值的变量使用let避免使用var以保证更好的作用域控制和可预测性同一作用域内不要重复声明变量
// 良好实践示例const PI = 3.14159;let count = 0;function increment() {  count += 1;  return count;}
版权声明

本文仅代表作者观点,不代表本站立场。
本文系作者授权本站发表,未经许可,不得转载。

作者文章
热门
最新文章
标签列表