JavaScript 变量

一、变量的核心概念

变量就像一个带标签的盒子，你可以把数据（数字、文字、对象等）存进去，之后通过标签（变量名）来访问或修改里面的数据。JavaScript 中声明变量有 3 种方式，对应不同的特性。

二、变量的声明方式

1. 三种声明关键字（ES6+）

关键字	作用域	变量提升	重复声明	能否修改	核心特点
var	函数作用域 / 全局	有（提升到作用域顶部，值为 undefined）	允许	能	ES5 及之前的声明方式，易出问题
let	块级作用域（{}内）	有 “暂时性死区”（不可提前访问）	不允许	能	ES6 推荐，替代 var
const	块级作用域	有 “暂时性死区”	不允许	不能（常量）	声明时必须赋值，值不可改（引用类型仅地址不可改）

2. 代码示例：三种声明方式对比

javascript

 

运行

// 1. var声明（函数/全局作用域，可重复声明）
var a = 10;
var a = 20; // 允许重复声明
console.log(a); // 输出 20

// 2. let声明（块级作用域，不可重复声明）
let b = 10;
// let b = 20; // 报错：Identifier 'b' has already been declared
if (true) {
  let b = 30; // 块内独立变量，不影响外部
  console.log(b); // 输出 30
}
console.log(b); // 输出 10

// 3. const声明（常量，不可修改）
const c = 100;
// c = 200; // 报错：Assignment to constant variable.
const obj = { name: "Adobe" };
obj.name = "JavaScript"; // 允许修改引用类型的属性（地址未变）
console.log(obj.name); // 输出 JavaScript

 

三、变量的命名规则（必须遵守）

1. 开头字符：只能以字母（a-z/A-Z）、下划线（_）、美元符号（$）开头，不能以数字开头。
2. 字符组成：后续字符可以是字母、数字、下划线、美元符号。
3. 大小写敏感：name 和 Name 是两个不同的变量。
4. 禁用关键字：不能使用 JavaScript 保留字（如let、const、if、function等）。
5. 规范建议：
   • 普通变量：小驼峰命名（如userName、totalPrice）；
   • 常量：全大写 + 下划线（如MAX_NUM、PI）。

错误 / 正确命名示例：

javascript

 

运行

// 错误命名
var 123num = 1; // 数字开头
var let = 2;    // 使用关键字
var user-name = 3; // 含非法字符（-）

// 正确命名
var num123 = 1;
var _userAge = 20;
var $price = 99;
const MAX_COUNT = 100;

 

四、变量提升与暂时性死区

1. 变量提升（仅var）

var声明的变量会被 “提升” 到作用域顶部，但赋值不会提升：

javascript

 

运行

console.log(x); // 输出 undefined（变量提升，未赋值）
var x = 10;
console.log(x); // 输出 10

 

2. 暂时性死区（let/const）

let/const声明的变量，在声明语句之前访问会报错，这就是 “暂时性死区”，避免了提前使用未定义的变量：

javascript

 

运行

 

// console.log(y); // 报错：Cannot access 'y' before initialization
let y = 20;
console.log(y); // 输出 20

 

五、变量的作用域

1. 全局作用域：在函数 / 块外部声明的变量，整个脚本都能访问（var/let/const声明的全局变量，前者挂载到window，后两者不挂载）。
2. 函数作用域：var声明的变量仅在函数内可访问。
3. 块级作用域：let/const声明的变量仅在{}内（如if/for/while块）可访问。

javascript

 

运行

 

 

 

 

// 全局作用域
var globalVar = "全局var";
let globalLet = "全局let";

function test() {
  // 函数作用域
  var funcVar = "函数内var";
  let funcLet = "函数内let";
  console.log(globalVar); // 可访问全局变量

  if (true) {
    // 块级作用域
    let blockLet = "块内let";
    console.log(funcVar); // 可访问函数内变量
  }
  // console.log(blockLet); // 报错：blockLet is not defined（块外不可访问）
}
test();
console.log(funcVar); // 报错：funcVar is not defined（函数外不可访问）

 

总结

1. 声明方式：优先使用let（可变变量）和const（常量），避免var（作用域不清晰、可重复声明）。
2. 命名规则：字母 / 下划线 /$ 开头，大小写敏感，禁用关键字，遵循小驼峰 / 全大写规范。
3. 核心特性：let/const有块级作用域和暂时性死区，const声明时必须赋值且不可修改值（引用类型仅地址不可改）。