4. 变量与常量（存储数据的盒子）

变量和常量是 JavaScript 中用于存储数据的容器。本章节将带你学习如何声明和使用变量与常量，以及它们之间的区别。

4.1 什么是变量？为什么要用变量？

变量是用于存储数据的容器，它可以存储各种类型的数据，如数字、字符串、布尔值等。变量的名称是我们给这个容器起的名字，通过这个名字我们可以访问和修改容器中的数据。

为什么要用变量？

• 存储数据：将数据存储在变量中，方便后续使用
• 数据复用：可以多次使用同一个变量，避免重复输入
• 数据更新：可以随时更新变量的值
• 代码可读性：使用有意义的变量名，使代码更易读

示例

// 存储用户信息
let name = 'John';
let age = 30;
let isStudent = false;

// 计算圆的面积
let radius = 5;
let pi = 3.14;
let area = pi * radius * radius;
console.log('圆的面积:', area);

4.2 变量声明：var / let / const（区别 + 新手推荐）

在 JavaScript 中，有三种声明变量的方式：var、let 和 const。

var

var 是 ES5 中声明变量的方式，具有以下特点：

• 函数作用域：变量只在声明它的函数内部可见
• 变量提升：变量声明会被提升到函数顶部
• 可以重复声明：同一个变量可以被多次声明

function test() {
    console.log(x);  // undefined（变量提升）
    var x = 5;
    console.log(x);  // 5
    var x = 10;  // 重复声明
    console.log(x);  // 10
}
test();

let

let 是 ES6 中引入的声明变量的方式，具有以下特点：

• 块级作用域：变量只在声明它的块内部可见
• 无变量提升：变量不会被提升，必须先声明后使用
• 不能重复声明：同一个变量不能在同一作用域内重复声明

function test() {
    // console.log(y);  // 错误：Cannot access 'y' before initialization
    let y = 5;
    console.log(y);  // 5
    // let y = 10;  // 错误：Identifier 'y' has already been declared
}
test();

if (true) {
    let z = 5;
    console.log(z);  // 5
}
// console.log(z);  // 错误：z is not defined

const

const 也是 ES6 中引入的声明变量的方式，具有以下特点：

• 块级作用域：变量只在声明它的块内部可见
• 无变量提升：变量不会被提升，必须先声明后使用
• 不能重复声明：同一个变量不能在同一作用域内重复声明
• 不能重新赋值：声明后不能修改其值（但对象和数组的属性可以修改）

const PI = 3.14;
console.log(PI);  // 3.14
// PI = 3.14159;  // 错误：Assignment to constant variable

const person = { name: 'John', age: 30 };
person.age = 31;  // 可以修改对象属性
console.log(person.age);  // 31
// person = { name: 'Jane', age: 25 };  // 错误：Assignment to constant variable

新手推荐

对于新手来说，建议：

• 优先使用 const，当需要修改变量值时使用 let
• 尽量避免使用 var，因为它的作用域规则可能会导致混乱

4.3 变量命名规则（必须遵守！）

JavaScript 变量命名必须遵守以下规则：

1. 只能包含字母、数字、下划线（_）和美元符号（$）
2. 不能以数字开头
3. 不能是 JavaScript 保留关键字（如 var、let、const、function 等）
4. 区分大小写（name 和 Name 是不同的变量）

保留关键字列表

abstract, arguments, await, boolean, break, byte, case, catch, char, class, const, continue, debugger, default, delete, do, double, else, enum, eval, export, extends, false, final, finally, float, for, function, goto, if, implements, import, in, instanceof, int, interface, let, long, native, new, null, package, private, protected, public, return, short, static, super, switch, synchronized, this, throw, throws, transient, true, try, typeof, var, void, volatile, while, with, yield

4.4 常量的使用场景

常量（const）适用于以下场景：

1. 固定值：如数学常数（π、e 等）
2. 配置值：如 API 地址、端口号等
3. 不希望被修改的值：如用户 ID、订单号等
4. 对象和数组：当你不希望整个对象或数组被替换时

示例

// 数学常数
const PI = 3.14159;
const E = 2.71828;

// 配置值
const API_URL = 'https://api.example.com';
const PORT = 3000;

// 用户信息
const USER_ID = '12345';

// 对象
const CONFIG = {
    theme: 'light',
    fontSize: 16,
    language: 'zh-CN'
};

4.5 随堂练习：声明变量存储姓名 / 年龄 / 性别

现在，让我们做一个练习，声明变量存储一个人的姓名、年龄和性别：

// 声明变量
let name = '张三';
let age = 25;
let gender = '男';

// 打印信息
console.log('姓名:', name);
console.log('年龄:', age);
console.log('性别:', gender);

// 更新年龄
age = 26;
console.log('更新后的年龄:', age);

// 使用模板字符串打印完整信息
console.log(`${name}，${age}岁，${gender}性`);

小结

通过本章节的学习，你已经掌握了：

• 什么是变量，以及为什么要使用变量
• 三种声明变量的方式：var、let 和 const，以及它们之间的区别
• 变量命名规则
• 常量的使用场景
• 如何声明变量存储和更新数据

在后续的章节中，我们将学习 JavaScript 的数据类型、运算符、条件语句、循环和函数等核心语法。