jsES6新语法可选链

语法:

• obj?.prop           //变量
• obj?.[expr]         //对象
• arr?.[index]        //数组
• func?.[argu]       //函数

如果在你不确定某个值是否为undefined或null时,可以使用?.可选链

举个例子

let obj={a:1,b:2}

这时候直接输出obj.c那么这个值为undefined,如果这时候继续输出一个obj.c.d那么这段代码就会报错

console.log(obj.c.d)  //报错

如果把.关键词换成?.关键词:

console.log(obj.c?.d)  //undefined

可选链在被调用时会隐式执行一段校验函数，并且不用重新定义变量，它判断出undefined或null时会立即返回一个undefined而不会继续执行后面的代码，这样的设计可以让代码更加简洁，同时还能提高执行效率。

可选链嵌套使用

可选链可以多重嵌套使用，当有多个?.时并不会影响代码的可读性性，同样，如果有一个值为undefined或null时也会直接返回undefined

空值合并操作符??可以设定默认值

??的作用

当左侧的操作数为 null 或者 undefined 时，返回其右侧操作数，否则返回左侧操作数

let customer = {
  name: "Carl",
  details: { age: 82 }
};
let customerCity = customer?.city ?? "暗之城";
console.log(customerCity); // “暗之城”

使用可选链时需要注意的点

可选链不能用于赋值

小结：

1. 可选链用于无法判断是否存在该参数时使用，如果灭有会立即返回undefined
2. 可选链可以嵌套
3. 可选链通过合并操作符设定默认值