时间戳

首页 > 解决方案 > 将数组转换为树

javascript - 将数组转换为树

问题描述

有一个数据数组需要转换成树：

const array = [{
  id: 5,
  name: 'vueJS',
  parentId: [3]
}, {
  id: 6,
  name: 'reactJS',
  parentId: [3]
}, {
  id: 3,
  name: 'js',
  parentId: [1]
}, {
  id: 1,
  name: 'development',
  parentId: null
}, {
  id: 4,
  name: 'oracle',
  parentId: [1,2]
}, {
  id: 2,
  name: 'data-analysis',
  parentId: null
}];

现在它使用这个函数工作：

function arrayToTree(array, parent) {
  var unflattenArray = [];
  array.forEach(function(item) {
    if(item.parentId === parent) {
      var children = arrayToTree(array, item.id);
      if(children.length) {
        item.children = children
      }
      unflattenArray.push(item)
    }
  });
  return unflattenArray;
}
console.log(arrayToTree(array, null));

我对这个功能有两个问题：

  1. “parentId”的值应该是一个id的数组，例如 - “parentId”: [2, 3]
  2. 如何仅将一个参数传递给函数-“数组”？

https://codepen.io/pershay/pen/PgVJOO?editors=0010

标签： javascriptarraystree

解决方案

我觉得这个问题令人困惑。听起来您真正想说的是数组表示“树中节点类型的定义”，而不是树中那些节点的实际实例。

所以你的问题是你需要将数组中的“定义”复制到树中的新“实例”节点。这将使“Oracle”显示两次，因为您将为其父数组中的每个父节点创建一个新的“oracle 实例”节点。根据您的使用情况，它在技术上不需要是深层副本，因此您可以使用 Object.assign 进行概念证明，但每个实例都将指向同一个父数组，并且可能会或可能不会导致该或将来参考的问题添加到定义中的值。

最后，根据树的大小和您真正想要做的事情，您可能希望转换为由节点/边而不是父/子表示的树。对于非常大的数据集，递归有时会给您带来问题。

抱歉，我在用手机，所以有些东西在 codepen 上很难看到。

推荐阅读