展平深層嵌套物件：逐步指南

理解問題
我們經常在 JavaScript 應用程式中遇到複雜的資料結構。這些結構可以是深度嵌套的對象，使得直接操作或處理它們變得具有挑戰性。一種常見的操作是展平這些對象，將它們轉換為更簡單的結構，其中所有屬性都位於頂層。

在這篇部落格中，我們將深入研究一個 JavaScript 程式碼片段，它可以有效地展平深度嵌套的物件。我們將逐行分解程式碼，解釋其邏輯和功能。

程式碼分解

let user = {
  name : 'Chiranjit',
  address : {
    personal : {
      city: 'Kolkata',
      state: 'West Bengal'
    },
    office : {
      city: 'Bengaluru',
      state: 'Karnataka',
      area: {
        landmark:'Waterside',
        post: 433101
      }
    }
  }
}
var finalObj = {} 

const flatObjFn = (obj, parent) => {
  for(let key in obj){
    if(typeof obj[key] === 'object'){
      flatObjFn(obj[key], parent+'_'+key)
    }else{
      finalObj[parent + '_' + key] = obj[key]
    }
  }
}

flatObjFn(user, 'user');
console.log(finalObj);

逐行解釋

1. 建立巢狀物件：
   • 我們先建立一個名為 user 的深度巢狀物件。它包含 屬性，例如名稱、地址以及其中進一步嵌套的對象 地址。

2. 初始化輸出物件：

   • 建立一個空物件finalObj來儲存展平結果。

3. 定義展平函數：

   • 定義了一個名為 flatObjFn 的函數，接受兩個參數： a) obj：要壓平的物件。 b)parent：為了清晰起見，為屬性名稱加上前綴的字串。

4. 迭代物件屬性：

   • for...in 迴圈迭代輸入物件 obj 的每個屬性。

5. 處理巢狀物件：

   • 如果屬性的值為對象，則 flatObjFn 函數為 遞歸呼叫該對象。父參數是 與當前屬性名稱連接以建立新的前綴 對於嵌套屬性。

6. 處理原始值：

   • 如果屬性的值不是物件（即原始值） 像字串或數字），它用一個鍵添加到 FinalObj 透過連接父級和目前屬性名稱形成。

7. 呼叫展平函數：

   • flatObjFn 被調用，用戶物件作為輸入，而「user」作為 初始父前綴。

8. 記錄扁平化物件：

   • 最終的展平物件使用列印到控制台 console.log(finalObj).

它是如何運作的？
flatObjFn 函數遞歸遍歷對象，將巢狀結構分解為平面對象。父參數追蹤物件層次結構，允許函數在輸出物件中建立有意義的屬性名稱。

讓我們在 Twitter 或 LinkedIn 上聯絡

以上是展平深層嵌套物件：逐步指南的詳細內容。更多資訊請關注PHP中文網其他相關文章！