Js中的?.运算符和??运算符

?.(链判断运算符)和??(Null判断运算符)都是Es6新增的特性。

1. ?.运算符

使用?.链式调用时，左侧的对象如果为null 或者 undefined ，表达式就不会再往下计算，而是返回 undefined。

之前我们在读取一个对象属性时，会先判断一下该对象是否存在，防止表达式报错；而用?.就可以达到同样的效果并且简化写法。

// 普通读取方式
const list = data && data.list
// ?.用法
const list = data?.list

1. ??运算符

??运算符又叫做Null判断运算符，通常是配合?.一起使用。

作用是如果??左侧的值为null 或者 undefined时，就会返回右侧的值。

实际开发中，我们通常会用 || 运算符指定默认值

const name = data.name || '张三'
// ?? 写法
const name = data.name ?? '张三'

?? 运算符相比于 ||运算符的好处在于，||判断时，左侧若为空字符串、false、0特殊数值，也会输出右侧的值；而?? 只有左侧值为null 或者 undefined时，才会返回右侧的值。

?. 和 ?? 配合使用

const name = data?.name ?? '张三'

这句代码中，如果data不是null 或者 undefined 就返回 data.name;如果是就返回张三。