JavaScript: JavaScript 数据类型
最后更新：2026-10-13
数据类型决定了数据能做什么操作——数字能加减，字符串能拼接，布尔能判断。搞清楚类型，才能避免 JS 最经典的那些坑。
1. JS 的数据类型
JavaScript 有 8 种数据类型，分为基本类型和引用类型两大阵营：
基本类型（7种）：String、Number、BigInt、Boolean、Undefined、Null、Symbol
引用类型（1种）：Object（数组、函数、日期等都是 Object 的子类型）
基本类型的数据存在栈内存中，赋值时拷贝值；引用类型的数据存在堆内存中，赋值时拷贝引用（地址）。这个区别后续课程会深入讲。
typeof 是检测数据类型的运算符，返回一个字符串：
| 值 | typeof 结果 |
|---|---|
"hello" |
"string" |
42 |
"number" |
9007199254740991n |
"bigint" |
true |
"boolean" |
undefined |
"undefined" |
null |
"object" (历史bug) |
{ } |
"object" |
function(){} |
"function" |
注意：typeof null 返回 "object"——这是 JS 诞生时的一个历史 bug，修不了了（改了会破坏老代码），记住就好。
3. 字符串和数字的陷阱
JS 中 + 运算符有两个用途：数字相加和字符串拼接。当 + 两边有字符串时，JS 会把另一个值也转成字符串来拼接：
"5" + 3变成"53"（字符串拼接，不是数学加法）5 + 3变成8（数学加法）"5" - 3变成2（减法没有拼接语义，自动转数字）
这是 JS 最经典的陷阱之一，新手必踩。解决方法：做数学运算前用 Number() 或 parseInt() 显式转换。
4. null vs undefined 的区别
这两个都表示"没有值"，但含义不同：
- undefined：变量已声明但未赋值，或者访问不存在的属性——"还没给值"
- null：开发者主动赋值为空——"明确设为空"
打个比方：undefined 是新房还没搬家具，null 是你主动把家具搬走了。
▶ 示例：typeof 检测各种类型
▶ 试一试▶ 示例：字符串与数字的陷阱
▶ 试一试▶ 示例：null 与 undefined 的区别
▶ 试一试▶ 示例：各种数据类型一览
▶ 试一试❓ 常见问题
Q 为什么
typeof null 是 "object"？A 这是 JS 第一版的历史 bug。当时 JS 用低位标识类型，
null 的低位全是 0，和 object 的标识一样，就误判了。后来想修，但改了会破坏大量现有代码，只好将错就错——就像一栋楼的地基歪了，住的人太多没法推倒重来。Q 怎么判断一个值是数组而不是普通对象？
A
typeof 对数组和对象都返回 "object"，区分不了。正确方法是用 Array.isArray()，比如 Array.isArray([1,2]) 返回 true，Array.isArray({}) 返回 false。Q NaN 是什么类型？
A
NaN（Not a Number）虽然名字叫"不是数字"，但 typeof NaN 返回 "number"。更离谱的是 NaN === NaN 返回 false——自己都不等于自己。判断 NaN 要用 isNaN() 或 Number.isNaN()。📖 小节
- JS 有 8 种数据类型：7 种基本类型 + 1 种引用类型 Object
typeof运算符检测类型，但typeof null返回"object"是历史遗留 bug+遇到字符串会拼接而非相加，"5" + 3得"53"不是8null表示"明确设为空"，undefined表示"还没给值"，二者严格不相等- 做数学运算前用
Number()或parseInt()显式转换，避免隐式转换的坑 - 数组
[]的 typeof 也是"object"，要区分数组和对象需要其他方法
📝 作业
- 基础题：声明 6 个变量分别对应 6 种基本类型（String、Number、Boolean、Undefined、Null、Object），用
typeof逐一检测并在页面上显示结果。 - 进阶题：创建一个页面，包含一个输入框，用户输入任意值后，JS 判断其类型（用 typeof）并显示在页面上。尝试输入数字、字符串、true、null 等，观察 typeof 的返回结果。
- 挑战题：创建一个"类型陷阱测试"页面，列出 5 道选择题测试用户对类型转换的理解，比如
"1" + 2等于什么、null == undefined是 true 还是 false 等，用户点击选项后显示对错和解释。
