javascript可选操作符 (?.)

?. 语法在ES2020 中被引入，用法如下：

obj.val?.pro  // 如果`val`存在，则返回`obj.val.prop`，否则返回 `undefined`。		
obj.func?.(args) // 如果 obj.func 存在，则返回 `obj.func?.(args)`，否则返回 `undefined`。
obj.arr?.[index] // 如果 obj.arr 存在，则返回 `obj.arr?.[index]`，否则返回 `undefined`。

obj?.data?.list 等于 obj && obj.data && obj.data.list

//假设我们有一个对象

let People = {
	other:{
		like:'code'
	},
	name:'cc',
	age:100,
	phone:'13888888888',
	getFirstName: function(){
    	return this.name;
  },
  arr:[{job:'写代码'},{job:'维护世界和平'}]  
}
//属性的访问
//访问存在的属性
console.log(People.other.like)
//访问不存在的属性
console.log(People.abc.like); 
// throws error "Uncaught TypeError: Cannot read property 'like' of undefined"

改用 ?. 访问不存在的属性：
console.log(People.abc.like); 
// undefined

//方法的访问
//访问存在的方法：
console.log(user.getFirstName()); 
// 前端小智

//访问不存在的方法：
console.log(user.getLastName()); 
// throws error "Uncaught TypeError: user.getLastName is not a function";

//改用 ?. 访问不存在的方法：
console.log(user.getLastName?.()); 
// "undefined"

//访问存在的数组：
console.log(user.arr[0].job); 
// "敲代码"

//访问不存在的数组：
console.log(user.arr[3].job); 
// throws error "Uncaught TypeError: Cannot read property 'name' of undefined"

改用 ?. 访问不存在的数组：
console.log(user.arr?.[0]?.name); 
// "undefined"

?? 操作符
我们知道 ?. 操作符号如果对象不存在，刚返回 undefined，开发中可能不返回 undefined 而是返回一个默认值，这时我们可以使用双问题 ?? 操作符。

const like= user.abc?.like;
console.log(like);
// undefined

const like= user.abc?.like?? "敲代码";
console.log(like);
// 敲代码