合并多个嵌套对象算法_多层嵌套对象的合并-CSDN博客

本文链接：https://blog.csdn.net/weixin_44523860/article/details/123210714

博客内容涉及JavaScript编程，主要展示了如何使用递归方法合并重复的路由对象。代码示例中，通过indexOf和lastIndexOf查找并合并具有相同名称的children，确保在保留一个父节点的同时不丢失子节点信息。示例在浏览器环境中运行以验证合并效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

合并前后效果：
在这里插入图片描述

思路：以第一个为准，后面的向前并入，使用indexof和lastIndexof找到重复的，递归子元素并放入前面的children内，并删除后面重复的，这样就可以在保留一个的情况下不会丢失子元素

控制台不够直观，我放到浏览器去看

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <script>
      let a = {
        name: 'cost',
        children: [
          {
            name: 'budget',
            children: [
              {
                name: 'budget1',
              },
              {
                name: 'budget2',
              },
            ],
          },
          {
            name: 'reports',
            children: [
              {
                name: 'reports1',
              },
            ],
          },
        ],
      }

      let b = {
        name: 'cost',
        children: [
          {
            name: 'user',
            children: [
              {
                name: 'user1',
              },
              {
                name: 'user2',
              },
            ],
          },
          {
            name: 'budget',
            children: [
              {
                name: 'budget3',
              },
            ],
          },
          {
            name: 'reports',
            children: [
              {
                name: 'reports2',
              },
            ],
          },
        ],
      }
      let c = {
        name: 'cost',
        children: [
          {
            name: 'budget',
            children: [
              {
                name: 'budget1',
              },
            ],
          },
          {
            name: 'reports',
            children: [
              {
                name: 'reports1',
              },
            ],
          },
        ],
      }
      console.log('合并前', a, b, c, '合并后', mergeRoute([a, b, c]))
      function mergeRoute(oRouters) {
        let routers = a
        for (let i = 1; i < oRouters.length; i++) {
          compareRoute(routers, oRouters[i])
        }
        return routers
      }
      function compareRoute(routerA, routerB) {
        let routers = []
        if (!routerA || !routerB || !routerA.children || !routerB.children)
          return null
        else if (!routerA.children) routers = routerB.children
        else if (!routerB.children) routers = routerA.children
        else routers = [...routerA.children, ...routerB.children]
        let names = routers.map((r) => r.name)
        for (let i = 0; i < routers.length; i++) {
          if (!routers[i]) continue
          let index = names.indexOf(routers[i].name),
            lastIndex = names.lastIndexOf(routers[i].name)
          if (index != lastIndex) {
            compareRoute(routers[index], routers[lastIndex])
            routers.splice(lastIndex, 1)
            names = routers.map((r) => r.name)
          }
        }
        routerA.children = routers
      }
    </script>
  </body>
</html>