在通常情况下,后端会返回多层数据嵌套的结果
例如:
let data = {
page: {
current_page: 1,
page_size: 7,
total_page: 1,
count: 5,
vipinfo: {
total_money: 1000,
expire_month: 12
}
}
}
//获取expire_month,传统写法
//如果没有以下预防措施,在访问expire_month时,JS可能会抛出TypeError: Cannot read property 'expire_month' of undefined错误
if (data && data.page != null && data.page.vipinfo != null) {
let expire_month = data.page.vipinfo.expire_month
}
传统的写法代码过于冗长,使用可选链的方式来编写,可以避免这个问题
//使用可选链写法
let expire_month = data?.page?.vipinfo?.expire_month
//等价于
if (data && data.page != null && data.page.vipinfo != null) {
let expire_month = data.page.vipinfo.expire_month
}
2.数组形式
let data = {
record: [{
id: 1329,
money: "0.01",
gold: 1000,
out_trade_no: "ds202011056462938386196517"
},
{
id: 1304,
money: "0.01",
gold: 1000,
out_trade_no: "ds202010163102316317522440"
}
]
}
//若要访问record里面的money
//使用可选链写法
let money = data?.record?.[0]?.money;
//等价于
if (data && data.record && data.record.length>0) {
let money = data.record[0].money;
}
当money 不存在时,需要指定一个默认值,此时我们可以用到双问号操作符
//当money不存在时,指定money值默认为10
let money = data?.record?.[0]?.money??10;