Loading...
JavaScript中一些强大的操作符,合理应用可以提升我们日常编码效率、简化代码、提升代码质量。
可选链操作符( ?.
)允许读取位于连接对象链深处的属性的值,而不必明确验证链中的每个引用是否有效。?.
操作符的功能类似于 .
链式操作符,不同之处在于,在引用为空(nullish ) (null 或者 undefined) 的情况下不会引起错误,该表达式短路返回值是 undefined
。与函数调用一起使用时,如果给定的函数不存在,则返回 undefined
。
当尝试访问可能不存在的对象属性时,可选链操作符将会使表达式更短、更简明。在探索一个对象的内容时,如果不能确定哪些属性必定存在,可选链操作符也是很有帮助的。
const obj = {
boo: 'Alice',
bar: {
name: 'Dinah'
}
};
const a = obj.boo?.a;
console.log(a);
// expected output: undefined
const b = obj.temp?.a;
console.log(b);
// expected output: undefined
console.log(obj.nonFun?.());
// expected output: undefined
逻辑空赋值运算符 (x ??= y) 仅在 x 是 nullish (null 或 undefined) 时对其赋值。
const obj = { a: 'a' };
obj.a ??= 'assign a';
console.log(obj.a);
// expected output: "a"
obj.b ??= 'assign b';
console.log(obj.b);
// expected output: "assign b"
空值合并操作符(??
)是一个逻辑操作符,当左侧的操作数为 null
或者 undefined
时,返回其右侧操作数,否则返回左侧操作数。
与逻辑或操作符(||
)不同,逻辑或操作符会在左侧操作数为假值时返回右侧操作数。也就是说,如果使用 ||
来为某些变量设置默认值,可能会遇到意料之外的行为。比如为假值(例如,''
或 0
)时。
const foo = null ?? 'foooo';
console.log(foo);
// expected output: "foooo"
const bar = '' ?? 'barrrrrr';
console.log(bar);
// expected output: ""