null 与 undefined
你已经学过布尔值——清楚的是或否。程序有时还要说「这里没有值。」 JavaScript 常见两种空:undefined 和 null。看起来像,但各自含义不同。本课先把它们分开,后面的类型转换和判断才不容易乱。
null 和 undefined 有什么区别?
undefined 通常表示「还没放进去」——用 let 声明却未赋值,或某处缺失。null 表示「故意为空」:你(或接口)主动赋 null 来清空位置。用 typeof 检查:typeof undefined 是 "undefined",而 typeof null 是由来已久的怪异结果 "object"。比较时优先用 ===。两者都是 falsy,但都不是布尔类型(true / false)。
空值工具表
📊 初学者对照:null 与 undefined
| 概念 | 示例 | 结果 / 说明 |
|---|---|---|
| 缺失 / 未赋值 | let x; 然后 x |
undefined |
| 有意清空 | let box = null |
你选择为空 |
typeof 缺失 |
typeof undefined |
"undefined" |
typeof 空值 |
typeof null |
"object"(怪异——仍表示空) |
| 严格比较 | box === null |
box 存 null 时为 true |
| 宽松比较提示 | null == undefined |
用 == 为 true ——为清晰请用 === |
undefined —— 尚未赋值
用 let 声明名称且不赋值。值就是 undefined。同时打印值和 typeof,记住标签 "undefined"。
let nickname;
console.log(nickname);
console.log(typeof nickname);
null —— 故意为空
需要明确表示「没有值」时,赋 null。这和忘记赋值不是一回事。
let selected = null;
console.log(selected);
console.log(typeof selected);
typeof 对照看
把两个结果放一起看。记住:typeof null 打印 "object" 是怪异现象,还不等于完整对象课。
console.log(typeof undefined);
console.log(typeof null);
let a;
let b = null;
console.log(typeof a);
console.log(typeof b);
对 null 与 undefined 优先用 ===
=== 同时比较值和类型。当你要说「正好是 null」或「正好是 undefined」时用它。用 == 时,null 与 undefined 可能互相匹配——初学时容易误读。
let user = null;
let title;
console.log(user === null);
console.log(title === undefined);
console.log(user === undefined);
宽松的 == 可能把两者混在一起
用 == 时,null 与 undefined 会互相匹配。打印一次看清——真正的检查仍用 ===。
console.log(null == undefined);
console.log(null === undefined);
第一行为 true,因为 == 较宽松。第二行为 false。真正的检查请用 ===,意图更清楚。
在页面上显示两种空
保存一个类似 undefined 的名字和一个 null,再用 textContent 写出短标签。
<!DOCTYPE html>
<html>
<head>
<title>null and undefined — labels</title>
</head>
<body>
<p id="out">…</p>
<script>
let title;
let avatar = null;
document.getElementById("out").textContent =
"title=" + title + " | avatar=" + avatar;
</script>
</body>
</html>
段落在一行里显示两种空。只把 avatar 改成短字符串,刷新后确认右半边更新,而 title 仍是 undefined。
自己动手
- 声明
let city;——不赋值,打印city和typeof city。 - 设
let bag = null;——打印值和typeof bag(会看到"object"怪异结果)。 - 一起打印
typeof undefined与typeof null,看清对比。 - 用
===比较:把存null的变量分别与null、undefined比较。 - 打印一次
null == undefined,再用===写真实检查。 - 在 HTML 演示里把
avatar设为"pic.png",刷新并读新行。
常见错误
- 认为
null与undefined永远可互换——含义不同(有意 vs 未赋值) - 看到
typeof null为"object"就慌——怪异结果;null仍是有意清空 - 盲目依赖二者之间的
==,没注意到宽松匹配 - 把它们叫成布尔值——它们是空值;布尔只有
true/false - 把空字符串
""当成null——""仍是字符串
小结
undefined:缺失 / 尚未赋值;typeof→"undefined"null:你主动赋的有意清空;typeof→"object"(怪异)- 清晰判断优先用
===;二者都是 falsy,但不是布尔 - 空字符串
""是文本——不等于null或undefined - 下一课:类型转换——有意地把一种值变成另一种
🧠 测试您的知识
测试您的知识
通过这个互动测验挑战自己,看看你对这个主题的理解程度如何
📝 说明
- 仔细阅读每个问题
- 为每个问题选择最佳答案
- 您可以随时重新参加测验
- 您的进度将显示在顶部