JS 新操作符 —— “?.”、“??”、“??=”
JS 新操作符 —— “?.”、“??”、“??=”
1. ?. （可选链式）
说明：
- Optional chaining，可选链式，安全地访问嵌套的对象属性
语法：
obj.prop1?.prop2obj.prop1?.[expr]obj.func?.(args)
比较：
// 旧语法
// 如果 && 前一个表达式不是 假值（null、undefined、false、''、0、NaN），则执行后面的表达式
person && person.info && person.info.name// lodash.get
lodash.get(person, 'info.name');// 新语法
// 如果 ?. 前一个表达式不是 nullish（null、undefined），则执行后面的表达式
person?.info?.name
示例：
const person = {// info: {// name: '张三',// 2: 'test',// sayHello(name) {// console.log('hello', name);// }// }
}console.log( person.info?.name ); // undefinedconsole.log( person.info?.[1 + 1] ); // undefinedperson.info?.sayHello?.('王五'); // undefined
参考：
- Optional chaining (?.) —— MDN
2. ??
说明：
- Nullish coalescing operator
- 逻辑运算符，如果左侧为 nullish（null、undefined）则执行右侧表达式
语法：
leftExpr ?? rightExpr
示例：
false || 'default' // 'default'false ?? 'default' // false
参考：
- Nullish coalescing operator (??) —— MDN
3. ??=
说明：
- Nullish coalescing assignment
- 赋值操作，如果左侧为 nullish（null、undefined）则将右侧表达式的值赋给左侧
语法：
x ??= y
比较：
// 旧语法
x || x = y// 新语法
x ??= y// 新语法等价于
if (x == null) { // <=> (x === null || x === undefined)x = y;
}
参考：
- Nullish coalescing assignment (??=) —— MDN