是空亦非空：属性值为空态的优雅判断

为什么属性值会为空？

在JavaScript中，属性值为空主要有以下几种情况：

• 变量未定义（undefined）：这是最常见的情况，通常是因为变量没有被正确赋值。
• 变量的值为null：这通常是为了明确表示某个值不存在或无效。
• 属性不存在：这可能是因为对象中确实没有该属性，或者因为对象的原型链中没有该属性。

属性值为空时会发生什么？

当我们尝试从 undefined 或 null 中取出数据时，就会发生错误。例如，以下代码会抛出 TypeError 异常：

const user = undefined;
console.log(user.name); // TypeError: Cannot read properties of undefined (reading 'name')

为了避免此类错误，我们需要在使用属性值之前检查其是否为空。

如何检查属性值是否为空？

在JavaScript中，我们可以使用以下方法来检查属性值是否为空：

• 使用if语句：

const user = undefined;

if (user === undefined || user === null) {
  console.log('User is undefined or null');
} else {
  console.log(user.name);
}

• 使用三元运算符：

const user = undefined;

const name = user ? user.name : 'John Doe';

console.log(name); // 'John Doe'

• 使用可选链运算符：

const user = undefined;

const name = user?.name;

console.log(name); // undefined

可选链运算符

可选链运算符（?.）是JavaScript中的一种新语法，它可以安全地访问嵌套对象的属性，即使其中某些属性不存在也不会报错。例如，以下代码不会抛出错误，而是返回 undefined：

const user = undefined;

const name = user?.name;

console.log(name); // undefined

可选链运算符的语法如下：

object?.property

其中，object 是要访问的对象，property 是要访问的属性。如果 object 为 undefined 或 null，则返回 undefined；否则，返回 object[property]。

何时使用可选链运算符？

可选链运算符非常适合在以下情况下使用：

• 当您不确定属性是否存在时。
• 当您不想在属性不存在时抛出错误时。
• 当您想在属性不存在时返回一个默认值时。

可选链运算符的局限性

可选链运算符虽然很强大，但也有其局限性。例如，它不能用于访问数组元素或函数参数。此外，它也不能用于调用方法。

总结

在JavaScript中，属性值为空是一个常见的问题。为了优雅地判断属性值是否为空，我们可以使用 if 语句、三元运算符或可选链运算符。其中，可选链运算符是最新也是最推荐的方法，因为它可以安全地访问嵌套对象的属性，即使其中某些属性不存在也不会报错。