ES2020新特性js运算符 ?. 、?? 、??= 解释说明

js运算符 ?. 、?? 、??= 解释说明

?. 可选链运算符，检查每个级别，如果碰到的是 undefined 或 null 属性，直接返回 undefined，不会继续往下检查

const obj = {a: 0, b: 1}

console.log(obj.c) // undefined

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

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

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

?? 空值合并运算符，仅在 左侧 是 nullish (null 或 undefined) 时，使用右侧的值

const obj = {a: 0, b: 1}

const n1 = obj.a || 1
console.log(n1) // 1

const n2 = obj.a ?? 1
console.log(n2) // 0

const b1 = false || 1
console.log(b1) // 1

const b2 = false ?? 1
console.log(b2) // false

const u1 = undefined || 1
console.log(u1) // 1

const u1 = undefined ?? 1
console.log(u2) // 1

const l1 = null || 1
console.log(l1) // 1

const l2 = null ?? 1
console.log(l2) // 1

??= 逻辑空赋值运算符 (x ??= y) 仅在 x 是 nullish (null 或 undefined) 时对其赋值

const obj = {a: 0, b: false}

obj.a ??= 2
console.log(obj.a) // 0

obj.b ??= 2
console.log(obj.b) // false

obj.c ??= 2
console.log(obj.c) // 2

obj.c ??= 3
console.log(obj.c) // 2