📜  获取 javascript 数组中子节点的所有父节点 - Javascript (1)

📅  最后修改于: 2023-12-03 15:11:50.418000             🧑  作者: Mango

获取 JavaScript 数组中子节点的所有父节点 - JavaScript

在开发 JavaScript 应用程序时,有时需要获取数组中某个子节点的所有父节点。本文将介绍如何使用递归实现此功能。

实现方式

考虑以下 JavaScript 数组:

const arr = [
  {
    id: 1,
    name: "Parent 1",
    children: [
      {
        id: 2,
        name: "Child 1",
        children: [
          {
            id: 3,
            name: "Grandchild 1",
            children: []
          },
          {
            id: 4,
            name: "Grandchild 2",
            children: []
          }
        ]
      },
      {
        id: 5,
        name: "Child 2",
        children: []
      }
    ]
  },
  {
    id: 6,
    name: "Parent 2",
    children: []
  }
];

我们需要获取 id 为 3 的节点的所有父节点。我们可以编写递归函数 findParents() 来实现这一功能。其实现方式如下:

function findParents(node, arr) {
  for (let i = 0; i < arr.length; i++) {
    const item = arr[i];
    if (item.id === node) {
      return [item];
    } else if (item.children && item.children.length) {
      const found = findParents(node, item.children);
      if (found) {
        return [item, ...found];
      }
    }
  }
  return null;
}

这个函数接受两个参数:要查找的节点 id 和要查找的数组。它会遍历数组中的每个项,并检查当前项是否为要查找的节点。如果是,它会返回当前项;否则,它会递归调用 findParents(),直到在当前节点的子树中找到要查找的节点。

示例

现在,我们可以使用 findParents() 函数查找 id 为 3 的节点的所有父节点。实现方式如下:

const node = 3;
const parents = findParents(node, arr);
console.log(parents);

它将输出以下数组:

[
  {
    id: 1,
    name: "Parent 1",
    children: [
      {
        id: 2,
        name: "Child 1",
        children: [
          {
            id: 3,
            name: "Grandchild 1",
            children: []
          },
          {
            id: 4,
            name: "Grandchild 2",
            children: []
          }
        ]
      },
      {
        id: 5,
        name: "Child 2",
        children: []
      }
    ]
  },
  {
    id: 2,
    name: "Child 1",
    children: [
      {
        id: 3,
        name: "Grandchild 1",
        children: []
      },
      {
        id: 4,
        name: "Grandchild 2",
        children: []
      }
    ]
  },
  {
    id: 3,
    name: "Grandchild 1",
    children: []
  }
]
总结

本文介绍了如何使用递归实现在 JavaScript 数组中获取子节点的所有父节点。这是一种非常有用的技术,在开发面向树结构的应用程序时非常有用。