可选链运算符(?.
),这是ES11的新语法,允许读取位于对象链深处的属性的值,不必明确验证链中的每个引用是否有效(参见MDN)。
示例1:
const db = {
host: '192.168.1.100',
username: 'root'
}
db.name // undefined
db.name.length // TypeError
当访问一个对象身上不存在的属性时,返回的是undefined;如果再进行链式访问length属性的话,就会报错了。
debug小技巧:如果发现 Uncaught TypeError: Cannot read properties of undefined (reading 'xxx') 诸如这样的报错,可以将错误快速定位到该属性的上一层级为undefined或null。
所以需要对访问对象的每一层做判断:
function main(config) {
// 保证对象每一层都有值
const dbHost = config && config.db && config.db.host
console.log("dbHost: ", dbHost);
}
const obj = {
db: {
host: '192.168.1.100',
username: 'root'
}
}
main(obj)
链式运算符与通过 '.'(点)的不同之处:在于引用对象为空(null 或者 undefined) 的情况下不会引起错误(不处理0和false的情况),该表达式短路返回值是 undefined
。
一般与 ??(双问号操作符,用于替换 || )联合使用。