JS 代码简洁之道 - 优雅判空 #17
Description
JS 代码简洁之道 - 优雅判断对象属性空值
参考文章：
如何优雅判断属性值为空
前言
当我们尝试从 null 或者 undefined 中通过属性取出数据时，会报错。因为 null 或 undefined 中根本就没有属性及对应的值。
“可选链” 这一语法可以帮助我们实现对象的优雅判空。
可选链
?.
可选链 ?. 是一种访问嵌套对象属性的安全的方式。
原理：如果可选链 ?. 前面的部分是 undefined 或者 null，它会停止运算并返回该部分。(短路效应)
换句话说，例如 value?.prop：
如果 value 存在，则结果与 value.prop 相同，
否则（当 value 为 undefined/null 时）则返回 undefined。
注意：
?.语法使其前面的值成为可选值，但不会对其后面的起作用。例如，在user?.address.street.name中，?.允许 user 为 null/undefined，但仅此而已。更深层次的属性是通过常规方式访问的。如果我们希望它们中的一些也是可选的，那么我们需要使用更多的?.来替换.。
?.不能用在赋值语句的左侧。
?.[]
若我们需要使用方括号 [] 而不是点符号 . 来访问属性，语法 ?.[] 可以代替 ?. 使用。跟前面的例子类似，它允许从一个可能不存在的对象上安全地读取属性。
?.()
?.() 用于调用一个可能不存在的函数。
let userAdmin = {
admin() {
alert("I am admin");
}
};
let userGuest = {};
userAdmin.admin?.(); // I am admin
userGuest.admin?.(); // 啥都没有（没有这样的方法）工作流程：首先使用点符号（userAdmin.admin）来获取 admin 属性，因为用户对象一定存在，因此可以安全地读取它。
然后 ?.() 会检查它左边的部分：如果 admin 函数存在，那么就调用运行它（对于 userAdmin）。否则（对于 userGuest）运算停止，没有错误。
总结
可选链 ?. 语法有三种形式：
obj?.prop—— 如果 obj 存在则返回obj.prop，否则返回 undefined。obj?.[prop]—— 如果 obj 存在则返回obj[prop]，否则返回 undefined。obj.method?.()—— 如果obj.method存在则调用obj.method()，否则返回 undefined。
正如我们所看到的，这些语法形式用起来都很简单直接。?.检查左边部分是否为 null/undefined，如果不是则继续运算。
?.链使我们能够安全地访问嵌套属性。
但是，我们应该谨慎地使用?.，仅在当左边部分不存在也没问题的情况下使用为宜。以保证在代码中有编程上的错误出现时，也不会对我们隐藏。