可选链表达式与双问号表达式

x?.y 如果x和y其中一个不存在,就返回undefined

如果 ?? 左边的值是 null 或者 undefined,那么就返回右边的值。

以下为代码运用案例

res可能有以下多种结果的情况

    var res1 = undefined
    var res2 = {
        x: {
            b: 1,
            c: 0,
            d: '',
        }
    }
    var res3 = {
        x: {
            b: 1,
            c: 0,
            d: '',
            e: {
                f: '零三'
            }
        }
    }

取 res1.x.b

普通写法

var b1 = res1 && res1.x && res.x.b // undefined

可选链写法

var b2 = res1?.x?.b // undefined

取res2.x.c

可选链写法-错误

var c1 = res2?.x?.c || 30 // 30
var d1 = res2?.x?.d || '零三' // 零三

c1错误原因:当我们要取 res1.x.c的时候,并且在res1.x.c不存在的是偶给他默认值为30

d1错误原因:res1.x.c是有值的,值为空字符串’’,在||判断时,’‘为false,导致结果为’零三’

优化写法

var c2 = res2?.x?.c !== undefined ? res2?.x?.c : 30 // 0
var d2 = res2?.x?.d !== undefined ? res2?.x?.d : '零三' // ''

双问号优化写法

var c3 =  res2?.x?.c ?? 30 // 0
var d3 = res2?.x?.d ?? '零三' // ''

猜你喜欢

转载自blog.csdn.net/weixin_43840202/article/details/116845789