【问题标题】:convert nested object in parent / children structure js在父/子结构js中转换嵌套对象
【发布时间】:2019-11-22 12:56:33
【问题描述】:

我尝试转换这个结构(每个孩子都是对象中的属性):

const tree = {
  "Parent 1" : {
    "Children1": {
      "Children2": {
          "#1": { info: {}},
          "#2": { info: {}}.
          "#3": { info: {}}
    },
    "Children1-1": {
      "Children2-2": {
          "#1": { info: {}},
          "#2": { info: {}}.
          "#3": { info: {}}
    }
  },
  "Parent 2": {
  ...
   }
};

在这个带有父子视图的树结构中。但在我的树的尽头,我不需要孩子

const resultTeee = [
  {
    name: 'Parent 1',
    children: [
      {
        name: 'Children 1',
        children: [
          {
            name: 'Children 2',
            children: [
              {name: "#1", info: {}},
              {name: "#2", info: {}}
            ]
          }
        ]
      },
      {
        name: 'Children 1-1',
        children: [
          {
            name: 'Children 2-2',
            children: [
              {name: "#1", info: {}},
              {name: "#2", info: {}}
            ]
          }
        ]
      }
    ]
  },
  {
    name: 'Parent 2'
    ....
  }
]

我尝试了“遍历树”方法,但不明白如何切换到新的子路径。对象的每一层都可以有多个嵌套结构

【问题讨论】:

  • 什么是rep: {}
  • 关于您的编辑:每个键值对都转换为一个对象。那么,为什么不是{name: "#1", children: [{ name: 'info', children: [] }]}

标签: javascript tree


【解决方案1】:
const toArrayTree = (obj) => {
    return Object.keys(obj).map(key => {
        return {name: key, children: [toArrayTree(obj[key])]}
    })
}

测试对象

const tree = {
    "Parent 1" : {
        "Children1": {
            "Children2": {
                "#1": { info: {}},
                "#2": { info: {}},
                "#3": { info: {}},
            }
        },
    },
    "Parent 2" : {
        "Children2.1": {
            "Children2.2": {
                "#4": { info: {}},
                "#5": { info: {}},
                "#6": { info: {}},
            }
        },
    },
};

但是正如@adiga 所说,为什么树的最后一个分支不是{ name: 'info', children: [] }

解决方案更新

const toArrayTree = (obj) => {
    return Object.keys(obj).map(key => {
        return typeof obj[key] === 'object' ?
            {name: key, children: [toArrayTree(obj[key])]} :
            {name: key, [key]: obj[key]};
    })
}

使用 Object(v) === v 确实是个坏主意,因为例如 v 是函数就是这样

【讨论】:

  • 所以最后我需要改变数据结构
  • @NickMedvik 很难检测到您何时需要停止转换。我想你可以添加一些 if 语句/三元运算符来检查键名,如果它的名字是“信息”并且它的值是对象 - 不需要转换。有必要这样做,因为我猜最后一个对象可能具有属性。还是它总是空对象?
  • @NickMedvik 递归终止逻辑从问题中不清楚。如果info: { count: 10 }info 对象,输出会是什么样子?
  • @NebSehemvi 它是具有属性的对象。所以我需要对 UI 中的不同逻辑进行这种分离。
  • @NebSehemvi 对象级别可以超过 1。我已经编辑了示例
猜你喜欢
  • 2019-06-15
  • 2023-03-18
  • 2020-04-03
  • 1970-01-01
  • 2018-01-04
  • 2018-03-10
  • 2018-06-07
  • 2013-03-08
  • 1970-01-01
相关资源
最近更新 更多