如何使用變量對對象屬性進行空檢查

Question

data 、 roles和infos是來自 API 的變量，在這里我手動添加數組的索引，而在我的代碼中我循環鍵。

如何一行檢查屬性是否為null ？

有沒有辦法訪問像x?[roles[0]]?[infos[0]]

const data = [{player: {fname: 'player', lname: 'one'}, 
              { enemy: {lname: 'two'},
              {  ally: {fname: 'player'}]
const roles = ['player','ally']
const infos  = ['fname','lname']

data.map(x => {
    const firstPlayer  = `${x[roles[0]][infos[0]]} ${x[roles[0]][infos[1]]}`
    const secondPlayer = `${x[roles[1]][infos[0]]} ${x[roles[1]][infos[1]]}`
    return `hello ${firstPlayer} and ${secondPlayer}`
});

Answer 1

您可以使用可選鏈接，這也適用於數組索引。

const firstPlayer  = `${x?.[roles[0]]?.[infos[0]]} ${x?.[roles[0]]?.[infos[1]]}`

請注意，如果鏈斷開，您將在字符串內部得到undefined 。

Answer 2

我會使用后備值來覆蓋未定義的值，如下所示：

 const data = [ { player: { fname: 'player', lname: 'one' }, enemy: { lname: 'two' }, ally: { fname: 'player' }}]; const roles = ['player', 'ally']; const infos = ['fname', 'lname']; const res = data.map((x) => { const firstPlayer = (x[roles[0]][infos[0]] || '') + ' ' + (x[roles[0]][infos[1]] || '') const secondPlayer = (x[roles[1]][infos[0]] || '') + ' ' + (x[roles[1]][infos[1]] || '') return ('hello ' + firstPlayer + ' and ' + secondPlayer).trim(); }); console.log(res);

通過使用(maybeUndefinedVar || 'fallbackValue')您可以在缺少值時進行處理。

請注意，這僅在您確定您的第一個屬性訪問肯定不是未定義時才有效。 在相反的情況下，您還應該應用其他 anwser 解決方案，並以安全的方式訪問屬性，如下所示：

 const data = [ { player: { fname: 'player', lname: 'one' }, enemy: { lname: 'two' }, allyNotExist: { fname: 'player' }}]; const roles = ['player', 'ally']; const infos = ['fname', 'lname']; const res = data.map((x) => { const firstPlayer = (x?.[roles[0]]?.[infos[0]] || '') + ' ' + (x?.[roles[0]]?.[infos[1]] || '') const secondPlayer = (x?.[roles[1]]?.[infos[0]] || 'NoName') + ' ' + (x?.[roles[1]]?.[infos[1]] || 'NoSurname') return ('hello ' + firstPlayer + ' and ' + secondPlayer).trim(); }); console.log(res);

如您所見，盟友不再存在，這樣我們就安全了。 如果第一個示例中不存在 ally，則無法訪問未定義的屬性。

Ps 對不起，如果我從 `strings 更改為' strings concat，但是這個片段不允許 ` 語法。

這應該是

const firstPlayer  = `${(x?.[roles[0]]?.[infos[0]] || '')} ${(x?.[roles[0]]?.[infos[1]] || '')}`