js 中 ？. 和??及??=的含义及用法说明

示例：?. 可选链

当变量为初始化时

let p;

let l;

console.log(p.value)

会报错如下

出现以上报错的原因:

js ES标准中有5 种基本类型:Undefined, Null, Boolean, Number, String。任何时候都不建议显式的设置一个变量为 undefined，保存对象的变量还没有真正保存对象，应该设置成 null。

因为undefined 和 null 不能用点操作符去访问属性的。

解决办法：出现上述问题的一般解决办法

let p;

let l;

if(!!p){

l = p.value;

}else{

l = undefined;

}

console.log(l)

简洁写法：

let p;

let l;

l= p?.value

console.log(l)

----------------------

let p={value:{name:2}};

let l;

l= p?.value?.name;

console.log(l)

//l = 2

示例2  空值合并运算符??

当一个值等于0时，我们也需要当它存在而不是返回false时

一般代码:

let p;

let l = 0;

let g = { name:'uz' }

if(!!l || l === 0 ){

    p = l;

}else{

    p = g;

}

console.log(p)

优化后代码:

let p;

let l = 0;

let g = { name:'uz' }

p = l ?? g;

console.log(p)

上述代码，当l是undefined或null时p等于l，当l不为undefined或null时p都等于g

实例3 空值运算符??=

//当??=  左侧的为null或undefined时，才会把??=右侧的值赋值给左侧

let p = '123';

let l = 1

let g = null;

let z = '456'

g ??= p;

z ??= l

console.log(g)//123

console.log(z)//456

测试：

let p;

let l = "一枚前端"

let g = null;

let r = 0;

let x;

x ??= p?.l ?? g ?? r?.p ?? l;

console.log(x)