js中可选链(?.)与非null赋值(??)的用法

一、可选链 ?.

一般在编写代码时，当从异步数据中取一些结构比较深的字段时，一般人写法是这样的：

data[0].userInfo.name

但是如果当接口返回的data为空数组时，此时就会报一个常见的错误：

有经验的开发人员会这样写来避免报错

data && data[0].userInfo && data[0].userInfo.name

这样即使userInfo为空，也避免报错。还有一种写法就是使用可选链:

data[0]?.userInfo?.name

只有当？前面的为真，才会走后面的操作，效果跟上面一样，还更加简洁。

二、非null赋值 ??

js 中 && 和 || 短路运算符是如果在进行前面的表达式的运算过程，通过判断已经明确的知道整个表达式的结果，那么就不会进行后面表达式的运算判断。
而 ?? 则会过滤 null 与 undefined ，当 ?? 前的值为这两种时，则会取后面的值，反之取前面的值。