通過鍵值從Javascript中的嵌套數組對象中刪除項目

Question

我有這樣的對象：

{
  "id": 1,
  "name": "first",
  "sections": [
    {
      "id": 1,
      "title": "First section",
      "contents": [
        {
          "id": "123",
          "title": "Sample title 1",
          "description": "<html>code</html>",
        },
        {
          "id": "124",
          "title": "Sample title 2",
          "description": "<html>code</html>"
        },
        {
          "id": "125",
          "title": "Some other sample",
          "description": "<html>code</html>"
        }
      ]
    },
    {
      "id": 2,
      "title": "Second section",
      "contents": [
        {
          "id": "126",
          "title": "Sample title 126",
          "description": "<html>code</html>"
        },
        {
          "id": "127",
          "title": "Sample title 127",
          "description": "<html>code</html>"
        }
      ]
    }
  ]
}

我想通過其 id 從內容數組中刪除特定對象（所有這些 id 都是唯一的）。

我可以很容易地找到我想刪除的元素，但我無法找到這個元素稍后要在哪個部分拼接它。

obj.sections.forEach(function(section) {
    section.contents.forEach((content) => {
        if (content.id == 125) {
            console.log(content)
            console.log(section)
        }
    })
})

在上面的代碼中 console.log(sections) 返回 undefined。 如何在包含具有特定 ID 的內容數組的部分數組中獲得位置。 例如， id: 125 將返回部分位置 0，因此我可以使用 splice 刪除該元素。

如果我的方法完全錯誤，請指出正確的方向，謝謝:)

Answer 1

為什么不使用簡單的過濾器來完成任務。 此外，這將是更清潔和不變的方式。

let newArrWithoutContentWithGivenId = obj.sections.map(section =>
     ({...section, contents: section.contents.filter(content => 
         content.id != 125)}));

在這里，我們將映射每個內容不包含 ID 125 的section > content.id != 125簡而言之， section > content.id != 125將從新數組中刪除。

希望能幫助到你：）

注意：代碼未經測試，只是為了幫助您找到一種干凈利落的方法。

Answer 2

您可以使用.filter()而不是.splice() 。 .filter()將保留您為其返回true所有項目，並丟棄您為其返回false所有項目。 因此，如果當前部分的內容對象的id等於您要刪除的對象，則可以返回false以刪除它，否則返回true以保留該項目。 您可以將其與.map()一起使用以將每個部分對象映射到具有更新內容數組的新對象：

 const obj = { "id": 1, "name": "first", "sections": [ { "id": 1, "title": "First section", "contents": [ { "id": "123", "title": "Sample title 1", "description": "<html>code</html>", }, { "id": "124", "title": "Sample title 2", "description": "<html>code</html>" }, { "id": "125", "title": "Some other sample", "description": "<html>code</html>" } ] }, { "id": 2, "title": "Second section", "contents": [ { "id": "126", "title": "Sample title 126", "description": "<html>code</html>" }, { "id": "127", "title": "Sample title 127", "description": "<html>code</html>" } ] } ] }; const idToRemove = 125; obj.sections = obj.sections.map( sec => ({...sec, contents: sec.contents.filter(({id}) => id != idToRemove)}) ); console.log(obj);

 .as-console-wrapper { max-height: 100% !important; top: 0; } /* ignore */

Answer 3

您只需要使用forEach的第二個參數:)

obj.sections.forEach(function(section, sectionIndex) {
    section.contents.forEach((content, contentIndex) => {
        if (content.id == 125) {
            // use the sectionIndex and contentIndex to remove
        }
    })
})

通過鍵值從Javascript中的嵌套數組對象中刪除項目

問題描述

3 個解決方案

解決方案1
3 2020-03-02 10:46:13

解決方案2
2 已采納 2020-03-02 10:45:48

解決方案3
1 2020-03-02 10:37:53

通過鍵值從Javascript中的嵌套數組對象中刪除項目

問題描述

3 個解決方案

解決方案1 3 2020-03-02 10:46:13

解決方案2 2 已采納 2020-03-02 10:45:48

解決方案3 1 2020-03-02 10:37:53

解決方案1
3 2020-03-02 10:46:13

解決方案2
2 已采納 2020-03-02 10:45:48

解決方案3
1 2020-03-02 10:37:53