javascript - 如何在 javascript 多级对象中动态添加对父对象的引用？

Question

在我正在使用的树对象中，一个节点可能有一个“children”属性，它可以包含一个子节点数组。这是一个多级菜单结构的概念。

我想实现的是在子项中动态添加对父项的引用。

我被困在我应该改变原始对象的地方。我不知道如何正确地做到这一点。

代码片段以一个示例对象开始。它后面跟着一个递归函数，该函数访问每个节点并保存对父节点的引用，但不修改对象。然后是一个修改对象的函数，但深度只有 3 个级别。

var obj = {
  id: "a",
  children: [{
      id: "b",
      children: [{
        id: "c"
      }]
    },
    {
      id: "d"
    }
  ]
};


function visitNode(node, parent) {
  if (node.children) {
    console.log('node with children', node, 'parent\'s ID is:', parent.id);
    node.children.forEach(child => visitNode(child, node));
  } else {
    console.log('node with no children:', node, 'parent\'s ID is:', parent.id);
  }
}
visitNode(obj, {id: null});

function mutate(obj) {
  obj.parentId = null;
  if (obj.children) {
    obj.children.forEach((child, i) => {
      obj.children[i].parentId = obj.id;
      if (child.children) {
        child.children.forEach((child2, j) => {
          obj.children[i].children[j].parentId = obj.children[i].id;
        })
      }
    })
  }
}

mutate(obj);
console.log('mutated object', obj);

Answer 1

您可以使用递归函数，该函数通过实际对象和父引用调用。如果子项存在，则迭代子项并使用实际引用再次调用该函数。

此提议创建了对该对象的循环引用(这意味着 JSON.stringify 可能不起作用)。

function setParent(object, parent) {
    object.parent = parent;
    object.children && object.children.forEach(function (o) {
        setParent(o, object);
    });
}

var object = { id: "a", children: [{ id: "b", children: [{ id: "c" }] }, { id: "d" }] };

setParent(object);

console.log(object);

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