正在加载...

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"。

默认的 undefined

javascript
let nickname;
console.log(nickname);
console.log(typeof nickname);

null —— 故意为空

需要明确表示「没有值」时,赋 null。这和忘记赋值不是一回事。

故意赋 null

javascript
let selected = null;
console.log(selected);
console.log(typeof selected);

typeof 对照看

把两个结果放一起看。记住:typeof null 打印 "object" 是怪异现象,还不等于完整对象课。

undefined 与 null 的 typeof

javascript
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 可能互相匹配——初学时容易误读。

用 === 做严格检查

javascript
let user = null;
let title;
console.log(user === null);
console.log(title === undefined);
console.log(user === undefined);

宽松的 == 可能把两者混在一起

用 == 时,null 与 undefined 会互相匹配。打印一次看清——真正的检查仍用 ===。

null 与 undefined 之间的宽松 ==

javascript
console.log(null == undefined);
console.log(null === undefined);

第一行为 true,因为 == 较宽松。第二行为 false。真正的检查请用 ===,意图更清楚。

在页面上显示两种空

保存一个类似 undefined 的名字和一个 null,再用 textContent 写出短标签。

null 与 undefined 的页面标签

html
<!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。

自己动手

  1. 声明 let city; ——不赋值,打印 city 和 typeof city。
  2. 设 let bag = null; ——打印值和 typeof bag(会看到 "object" 怪异结果)。
  3. 一起打印 typeof undefined 与 typeof null,看清对比。
  4. 用 === 比较:把存 null 的变量分别与 null、undefined 比较。
  5. 打印一次 null == undefined,再用 === 写真实检查。
  6. 在 HTML 演示里把 avatar 设为 "pic.png",刷新并读新行。

常见错误

  • 认为 null 与 undefined 永远可互换——含义不同(有意 vs 未赋值)
  • 看到 typeof null 为 "object" 就慌——怪异结果;null 仍是有意清空
  • 盲目依赖二者之间的 ==,没注意到宽松匹配
  • 把它们叫成布尔值——它们是空值;布尔只有 true / false
  • 把空字符串 "" 当成 null——"" 仍是字符串

小结

  • undefined:缺失 / 尚未赋值;typeof → "undefined"
  • null:你主动赋的有意清空;typeof → "object"(怪异)
  • 清晰判断优先用 ===;二者都是 falsy,但不是布尔
  • 空字符串 "" 是文本——不等于 null 或 undefined
  • 下一课:类型转换——有意地把一种值变成另一种

🧠 测试您的知识

准备开始

测试您的知识

通过这个互动测验挑战自己,看看你对这个主题的理解程度如何

❓
8
问题
🎯
70%
及格要求
♾️
∞
时间
🔄
∞
尝试次数

📝 说明

  • 仔细阅读每个问题
  • 为每个问题选择最佳答案
  • 您可以随时重新参加测验
  • 您的进度将显示在顶部