使用vanilla javascript展平嵌套对象的一部分

vd8tlhqk  于 2023-02-28  发布在  Java
关注(0)|答案(2)|浏览(147)

我正在使用一个返回过滤后的结果版本的库。问题是结果会为数组中的每个对象添加一个额外的“项目”层,而数组不是我需要的格式。请注意下面是如何将单位和部门 Package 在“ITEM”:{}对象中的。我希望仅使用vanilla javascript删除该项目层。

{
  "units": [
    {
      "ITEM": {
        "UnitName": "Unit1",
        "UnitID": 1,
        "depts": [
          {"ITEM": {"DeptName": "Dept1-1"}}
        ]
      }
    },
    {
      "ITEM": {
        "UnitName": "Unit2",
        "UnitID": 2,
        "depts": [
          {"ITEM": {"DeptName": "Dept2-1"}},
          {"ITEM": { "DeptName": "Dept2-2"}}
        ]
      }
    }
  ]
}

我想部分扁平化这使它看起来像下面。

{
  "units": [
    {
        "UnitName": "Unit1",
        "UnitID": 1,
        "depts": [
          {"DeptName": "Dept1-1"}
        ]
    },
    {
        "UnitName": "Unit2",
        "UnitID": 2,
        "depts": [
          {"DeptName": "Dept2-1"},
          { "DeptName": "Dept2-2"}
        ]
    }
  ]
}

因为我将对其他数据重复这个过程,所以我尝试找出一个通用函数,每当数组中的每个返回对象都被一个“item”对象包裹时,这个函数就可以移除这个额外的层。然而,我能找到的每个扁平化javascript对象的示例都假设我希望整个对象都被扁平化。Example 1Example 2
我确信已经有一个现成的解决方案了,但是我可能需要使用另一个词而不是扁平化来找到正确的结果。

e4yzc0pl

e4yzc0pl1#

您可以使用Object.assign和map on array来实现这一点:

data = Object.assign(data, {
  "units": data.units
    .map((u) => Object.assign(u.ITEM, {
       "depts": u.ITEM.depts
         .map((d) => d.ITEM) 
    }))
});
w3nuxt5m

w3nuxt5m2#

您可以递归遍历对象树并清除:

// traverses the object tree and replaces `{ ITEM: ??? }` with the `???`
function removeITEM(item) {
  if (typeof item !== "object" || item === null) return item;

  if (Array.isArray(item)) return item.map(removeITEM);

  // that's where the cleanup happens
  if (item.ITEM) return removeITEM(item.ITEM);

  let copy = {};
  for (let key in item) {
    copy[key] = removeITEM(item[key]);
  }
  return copy;
}

console.log(removeITEM({
  "units": [
    {
      "ITEM": {
        "UnitName": "Unit1",
        "UnitID": 1,
        "depts": [
          { "ITEM": { "DeptName": "Dept1-1" } }
        ]
      }
    },
    {
      "ITEM": {
        "UnitName": "Unit2",
        "UnitID": 2,
        "depts": [
          { "ITEM": { "DeptName": "Dept2-1" } },
          { "ITEM": { "DeptName": "Dept2-2" } }
        ]
      }
    }
  ]
}));
.as-console-wrapper{top:0;max-height:100%!important}

或者另一种选择:如果您可以访问JSON字符串 (如通过ajax请求),则可以选择清理JSON.parse()上的数据结构:
一个二个一个一个

相关问题