可选链操作符( ?. )和空值合并操作符(??)[es2020]

406 阅读1分钟

在翻看书时偶然看到了使用?.对对象进行链式访问,当时并不了解它的用法,所以查阅了一些资料。

?.

?.是可选链式操作符,是用于应对在开发中访问嵌套在内部多层级属性的时候,可能会报错Cannot read property...这种报错,使得整块程序终止运行,因此需要判断一下每一段是否是undefined,如:

var str = obj&&obj.objone&&obj.objone.objtwo

确认非 null且不是 undefined。

有了可选链式调用 ,可以简化校验操作,而且更安全:

var str = obj?.obj.objone?.obj.objone.objtwo

通过使用 ?. 操作符取代 . 操作符,JavaScript 会在尝试访问 obj.objone.objtwo 之前,先隐式地检查并确定 objobj.objone 既不是 null 也不是 undefined。如果是 null 或者 undefined,表达式将会短路计算直接返回 undefined,不会使程序停止运行。 这等价于以下表达式,但实际上并没有创建临时变量:

let temp = obj.objone;
let nestedProp = ((temp === null || temp === undefined) ? undefined : temp.objtwo);

当尝试调用一个可能不存在的方法时也可以使用可选链。 函数调用时如果被调用的方法不存在,使用可选链可以使表达式自动返回undefined而不是抛出一个异常。

let result = someInterface.customMethod?.();
let obj={
	ice:function(){
            console.log("hello")
            }
	}
	obj.ice?.() //=>hello

注意:  如果存在一个属性名且不是函数, 使用 ?. 仍然会产生一个 TypeError 异常 (x.y`` is not a function).

注意:  如果 someInterface 自身是 null 或者 undefined ,异常 TypeError 仍会被抛出 someInterface is null 如果你希望允许 someInterface 也为 null 或者 undefined ,那么你需要像这样写 someInterface?.customMethod?.()

注意:?.也可访问数组但不可用于赋值。

??

空值合并操作符(还未更新完...)