理解 JavaScript 变量和数据类型的基础
Source: Dev.to
请提供您希望翻译的具体文本内容，我会按照要求保留源链接、格式和技术术语，仅翻译正文部分。
什么是变量？
把变量想象成一个 盒子：
- 你把名字放进去。
- 盒子唯一的职责是 保存信息，以便以后使用。
在 JavaScript 中，这个盒子被称为 变量。
每个程序——无论是一个简单的计算器还是像 Netflix 这样的大型应用——都依赖变量来存储和管理数据。如果你不理解变量，你实际上并没有在编程——只是在敲垃圾。
使用变量的关键原因
- 重用值
- 更新值
- 使程序动态化
- 编写更清晰的代码
简单示例
let name = "Ritam";
console.log(name);name→ 变量"Ritam"→ 存储在其中的值
可以这样想：
[ name ] → "Ritam"没有变量，程序将会僵硬且毫无用处。
在 JavaScript 中声明变量
JavaScript 为我们提供了 三 种声明变量的方式：
| 声明 | 引入时间 | 典型用法 |
|---|---|---|
var | ES1 (1997) | 旧代码，函数作用域 |
let | ES6 (2015) | 块作用域，可变 |
const | ES6 (2015) | 块作用域，不可变 |
var
var age = 20;- 最早也是最原始的变量声明方式。
- 函数作用域（如果在函数外声明，则为全局作用域）。
- 可以重新声明和重新赋值，这常常导致错误。
提示： 在现代代码中你几乎不会使用
var。请优先使用let或const。
let
let city = "Kolkata";- 块作用域。
- 可以 重新赋值，但在同一作用域内不能重新声明。
let score = 10;
score = 20; // ✅ 允许const
const country = "India";- 块作用域。
- 初始化后不能重新赋值。
const PI = 3.14;
PI = 3.14159; // ❌ 错误
console.log(PI); // 3.14何时使用
const– 当一个值应保持不变时（例如配置值、固定引用）。
想了解 let 和 const 引入背后的更深层原因，请参阅我之前的博客 [here]。
Source: …
数据类型
数据类型定义了变量中存储的值的种类。JavaScript 有两大类：
- 原始数据类型
- 非原始（引用）数据类型
本文将介绍 原始 类型。后续文章会深入对象、数组、函数等内容。
⚠️ 注意： 这是一篇 基础 概览。完整参考请查阅 MDN Web Docs。
原始类型概览
| 类型 | 描述 | 示例 |
|---|---|---|
String | 文本数据，使用引号（"" 或 ''）包裹。 | let name = "Ritam"; |
Number | 数值数据（包括整数和浮点数）。 | let age = 21; |
Boolean | 逻辑真/假。 | let isStudent = true; |
null | 有意的空值。 | let result = null; |
undefined | 已声明但未赋值的变量。 | let data; console.log(data); // undefined |
BigInt | 超出安全整数范围的超大整数。 | let big = 12345678901234567890n; |
Symbol | 唯一标识符。 | const id = Symbol("rune_of_fire"); |
String
let name = "Ritam";
let programming = "JavaScript";
let id = "123"; // 仍然是字符串！Number
let age = 21;
let price = 99.99;Boolean
let isStudent = true;
let isLoggedIn = false;null
let result = null;undefined
let data;
console.log(data); // undefined注意： 虽然可以显式地把
undefined赋给变量，但通常不推荐这样做，因为会增加调试难度。
BigInt
let bigNumber = 123456789012345678901234567890n; // 末尾的 "n"
let bigValue = BigInt(12345678901234567890); // 使用构造函数什么时候需要 BigInt？
- 金融系统（精确的货币计算）
- 加密学
- 科学计算
- 大型数据库 ID
Symbol
const uniqueRuneId1 = Symbol("rune_of_fire");
const uniqueRuneId2 = Symbol("rune_of_fire");
console.log(uniqueRuneId1 === uniqueRuneId2); // false典型用途
- 唯一的对象属性键
- 高级 JavaScript 模式（例如迭代器）
- 内置机制（例如
Symbol.iterator）
typeof 运算符
console.log(typeof "Ritam"); // "string"
console.log(typeof 21); // "number"
console.log(typeof true); // "boolean"⚡ 小练习：
typeof null返回什么？在运行代码之前先思考一下！
深入理解 typeof 很重要，因为它的结果并不总是符合预期（例如，typeof null 是 "object"）。我们将在后续文章中更详细地探讨这个运算符。
快速比较：var vs let vs const
| Feature | var | let | const |
|---|---|---|---|
| Scope | 函数作用域或全局 | 块级作用域 | 块级作用域 |
| Hoisting | 是（初始化为 undefined） | 是（暂时性死区） | 是（暂时性死区） |
| Re‑declaration | 在相同作用域内允许重新声明 | 在相同块级作用域内不允许 | 在相同块级作用域内不允许 |
| Re‑assignment | 允许 | 允许 | 不允许 在初始化后 |
| Use case | 遗留代码，极少推荐 | 值会变化的变量 | 常量、配置值 |
JavaScript 中的变量声明
| Feature | var | let | const |
|---|---|---|---|
| Signed? | ✅ 是 | ✅ 是 | ❌ 否 |
| Scope type | 函数 | 块级 | 块级 |
| Hoisting | 提升 | 提升 – 但 Temporal Dead Zone (TDZ) 仍适用 | 提升 – 但 Temporal Dead Zone (TDZ) 仍适用 |
| Modern usage? | ❌ 避免 | ✅ 是 | ✅ 是 |
实用规则
- 默认使用
const。 - 当需要更改值时使用
let。 - 在现代 JavaScript 中避免使用
var。
为什么变量很重要
变量不仅仅是初学者的话题——它们是以下内容的基础：
- 函数
- 循环
- API
- 像 React 这样的框架
- 使用 Node.js 的后端开发
如果你误解了变量和数据类型，所有基于它们构建的东西都会变得不稳定。
掌握变量让你拥有真正的控制
- 如何 声明 变量
- 何时使用
let与const - 数据类型 表示什么
…and this knowledge translates into solid, maintainable code.
入门
- 从简单开始。
- 循序渐进地构建理解。
这就是实现真正领悟的方式。
关注获取更多面向初学者的核心软件工程概念拆解。