如何安全访问嵌套对象

2020-08-28  本文已影响0人  是努力的鸣谦啊

请直接跳到文末

当我们在项目中需要读取位于连接对象链深处的属性的值的时候,需要做一些边界处理,否则有可能会报错。

举个例子:
正常的数据结构

const user = {
  id: 1,
  email: 'carlo@bingshan.com',
  info: {
    name: 'carlo',
    address: {
      country: 'china',
      provinces: 'liaoning',
      city: 'dalian', street: 'aaaaaaaa'
    }
  }
}

缺失一部分

const user = {
  id: 1,
  email: 'carlo@bingshan.com',
  info: {
    name: 'carlo'
  }
}
console.log(user.info.address.city); // TypeError: Cannot read property 'city' of undefined

安全写法:

if (user && user.info && user.info.address && user.info.address.city) {
  let cityStr = user.info.address.city;
} else { }

// 或者
let cityStr = user && user.info && user.info.address ? user.info.address.city : '';
let cityStr = (((user || {}).info || {}).address || {}).city;

================== 哗啦哗啦的分割线 ==================

这篇东西我自己都不记得是啥时候写的了,今天翻翻草稿,看到了,舍不得删,不过上面那一大串都不是重点,现在已经出了新语法了

let cityStr = user?.info?.address?.city;
// ?.  这个语法的学名叫做可选链
上一篇下一篇

猜你喜欢

热点阅读