ES6链判断运算符(用于读取对象属性时判断是否为null或者undefined)

使用场景

当我们需要调用一个对象的某个属性但是我们却不确定这个属性是否存在时,如果直接读取的话可能就会报错,所以我们需要在调用之前先判断这个属性是否存在。

// 错误的写法,可能会报错
const  firstName = message.body.user.firstName;

// 正确的写法
const firstName = (message
  && message.body
  && message.body.user
  && message.body.user.firstName) || 'default';

这样读取一个属性显得非常麻烦,ES2020引入了链判断运算符 ?. 来简化这个操作:

const firstName = message?.body?.user?.firstName || 'default';

上面代码使用了?.运算符,直接在链式调用的时候判断,左侧的对象是否为null或undefined。如果是的,就不再往下运算,而是返回undefined,然后将默认值default赋值给变量。
链判断运算符还可以在调用方法时判断该方法是否存在:

iterator.return?.()

注意以下场景会报错

// 构造函数
new a?.()
new a?.b()

// 链判断运算符的右侧有模板字符串
a?.`{b}`
a?.b`{c}`

// 链判断运算符的左侧是 super
super?.()
super?.foo

// 链运算符用于赋值运算符左侧
a?.b = c

总结于阮一峰的ES6入门,想要详细了解请跳转至官方文档。

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值