原生JS判断undefined报错：无法读取null的custom_topic属性

嘿，我太懂你这个头疼的报错了！你遇到的核心问题是：在尝试访问content.context_data.custom_topic之前，没有先确认content.context_data本身不是null或undefined。当context_data是null的时候，直接去读它的custom_topic属性，浏览器就会抛出那个讨厌的TypeError，根本轮不到你判断custom_topic是否存在。

为什么你之前的代码会失效？ #

你原来写的if (content.context_data.custom_topic === undefined)，在content.context_data为null时，这行代码本身就会报错——因为null是没有任何属性的，你没法从null上读取custom_topic。

几种可行的解决方案 #

1. 用ES2020+的可选链操作符（最简洁）

如果你的运行环境支持ES2020及以上（现代浏览器、Node.js 14+等），可选链?.是最省心的方案，它会自动在链上的某个值为null/undefined时停止访问，返回undefined而不报错：

let custom_topic;
if (content.context_data?.custom_topic !== undefined) {
  custom_topic = content.context_data.custom_topic;
}
// 甚至可以更简化：
const custom_topic = content.context_data?.custom_topic;
// 如果context_data是null/undefined，custom_topic就会是undefined，不会报错

2. 逐步检查每一层（兼容旧环境）

如果需要兼容不支持可选链的环境，就得一层一层手动检查，确保每一级都存在且不是null：

let custom_topic;
// 先检查content存在，再检查context_data不是null/undefined，最后检查custom_topic
if (content && content.context_data && content.context_data.custom_topic !== undefined) {
  custom_topic = content.context_data.custom_topic;
}

或者用typeof来更严谨地判断（避免content是undefined时的报错）：

let custom_topic;
if (typeof content !== 'undefined' && content !== null 
    && typeof content.context_data !== 'undefined' && content.context_data !== null
    && typeof content.context_data.custom_topic !== 'undefined') {
  custom_topic = content.context_data.custom_topic;
}

3. 结合空值合并运算符（可选）

如果想给custom_topic设置默认值，可以搭配空值合并运算符??：

const custom_topic = content.context_data?.custom_topic ?? '默认值';
// 只有当custom_topic是undefined或null时，才会用默认值

这样就能完美避免你遇到的TypeError，同时实现你想要的“仅当custom_topic可用时赋值”的逻辑啦！

内容的提问来源于stack exchange，提问作者Ronnie Oosting