1. 程式人生 > >在JavaScript中安全訪問嵌套對象

在JavaScript中安全訪問嵌套對象

如果 當我 tro 是否 pan java other .com pro

大多數情況下,當我們使用JavaScript時,我們將處理嵌套對象,並且通常我們需要安全地訪問最裏面的嵌套值。

比如:

const user = {
 id: 101,
 email: ‘[email protected]‘,
 personalInfo: {
   name: ‘Jack‘,
   address: {
     line1: ‘westwish st‘,
     line2: ‘washmasher‘,
     city: ‘wallas‘,
     state: ‘WX‘
   }
 }
}

要訪問我們用戶的名字,我們會寫

const name = user.personalInfo.name;

這很簡單直接。但是,由於某種原因,如果我們用戶的個人信息不可用,那麽對象結構將是這樣的,

const user = {
 id: 101,
 email: ‘[email protected]‘
}

現在,如果嘗試訪問該名稱,將被拋出無法讀取未定義的屬性“名稱”

/* Cannot read property ‘name‘ of undefined */
const name = user.personalInfo.name;

大多數處理這種情況的常用方法是這樣

const name = user && user.personalInfo ? 
              user.personalInfo.name : null;

如果嵌套結構很簡單,這是可以的,但是如果數據嵌套了5或6級,那麽代碼看起來會非常混亂,這時就要另外一種優雅的寫法了,直接看代碼:

const name = ((user || {}).personalInfo || {}).name;

上面寫法會檢查用戶是否存在,如果沒有,就動態創建一個空對象。這樣,下一級鍵將始終從存在的對象或空對象訪問,但永遠不會報讀取不到值的錯

在JavaScript中安全訪問嵌套對象