从嵌套对象收集子级的值并分配给父级属性

Question

我有对象数组。所有对象及其子对象都包含权限属性数组。我必须从分配给相应父级的子级收集权限属性值。如果一个父项有多个子项，则父项的权限应该是所有子项的权限。

const navItems: any[] = [
     {
      text: 'Analytics',
      imageUrl: '../assets/images/Qi-white.png',
      permissions: [],
      children: [
        {
          text: 'Reports',
          icon: 'layout',
          permissions: ['rep1'],
          route: 'reports/reports',
        },
        {
          text: 'NewSelectionPanel',
          icon: 'layout',
          permissions: ['rep2'],
          route: 'reports/reportsNew',
        },
      ],
    },
    {
      text: 'Static Data',
      icon: 'parameters',
      permissions:[],
      children: [
        {
          text: 'Geographic Defs',
          permissions:[],
          maticon: 'settings',
          children: [
            {
              text: 'Country',
              maticon: 'grid_view',
              permissions: ['cou'],
              route: 'static-data/country',
            },
            {
              text: 'Country Allocation',
              maticon: 'grid_view',
              permissions: ['cou-allo'],
              route: 'static-data/group-to-country',
            } 
          ],
        },
        {
          text: 'Node Defs',
          maticon: 'settings',
          permissions:[],
          children: [
            {
              text: 'Node Category',
              maticon: 'grid_view',
              permissions: ['no1'],
              route: 'static-data/category',
            },
            {
              text: 'Node Class',
              maticon: 'grid_view',
              permissions: ['no2'],
              route: 'static-data/node-class',
            },
            {
              text: 'Node Classification',
              maticon: 'grid_view',
              permissions: ['no3'],
              route: 'static-data/classification',
            }
          
          ],
        },
        
        
      ],
      
    }
  ];

获取权限后，应遵循以下结构

  const navItems: any[] = [
     {
      text: 'Analytics',
      imageUrl: '../assets/images/Qi-white.png',
      permissions: ['rep1','rep2'],
      children: [
        {
          text: 'Reports',
          icon: 'layout',
          permissions: ['rep1'],
          route: 'reports/reports',
        },
        {
          text: 'NewSelectionPanel',
          icon: 'layout',
          permissions: ['rep2'],
          route: 'reports/reportsNew',
        },
      ],
    },
    {
      text: 'Static Data',
      icon: 'parameters',
      permissions:['cou-allo','cou','no1','no2','no3'],
      children: [
        {
          text: 'Geographic Defs',
          permissions:['cou-allo','cou'],
          maticon: 'settings',
          children: [
            {
              text: 'Country',
              maticon: 'grid_view',
              permissions: ['cou'],
              route: 'static-data/country',
            },
            {
              text: 'Country Allocation',
              maticon: 'grid_view',
              permissions: ['cou-allo'],
              route: 'static-data/group-to-country',
            } 
          ],
        },
        {
          text: 'Node Defs',
          maticon: 'settings',
          permissions:['no1','no2','no3'],
          children: [
            {
              text: 'Node Category',
              maticon: 'grid_view',
              permissions: ['no1'],
              route: 'static-data/category',
            },
            {
              text: 'Node Class',
              maticon: 'grid_view',
              permissions: ['no2'],
              route: 'static-data/node-class',
            },
            {
              text: 'Node Classification',
              maticon: 'grid_view',
              permissions: ['no3'],
              route: 'static-data/classification',
            }
          
          ],
        },
        
        
      ],
      
    }
     
  ];

Answer 1

你显然想要改变你的对象，这是对不变性、纯洁性和函数式编程之神的亵渎。

另一方面，既然无论发生什么情况都注定要失败，那么至少可以省去复制所有内容并将JavaScript限制为一长串链式数组函数的惯例。

简单的循环可以很好地完成这个任务，而不会浪费内存和CPU。

function GatherPermissions (input)
{
    function flatten_permissions (item) {
        // will merge two arrays and remove duplicates
/* If permissions are unique (i.e. you won't find the same permission in two different
   children) and you use that function wisely (i.e. you call it only once), then you don't
   need to enforce uniqueness and a simple "a.concat(b)" will be enough */
        function merge_unique (a, b) {
            return a.concat(b).filter((i, p, c) => c.indexOf(i) === p);
        }

        let flat_permissions = item.permissions ?? [];
        for (child of item.children ?? []) {
            flat_permissions = merge_unique (flat_permissions, flatten_permissions(child))
        }
        return item.permissions = flat_permissions; // mutation occurs there (booh!)
    }
    for (item of input) flatten_permissions(item);
}    

使用您的输入的示例输出：

GatherPermissions (navItems);
console.log(`${JSON.stringify(navItems,undefined,4)}`);

[
    {
        "text": "Analytics",
        "imageUrl": "../assets/images/Qi-white.png",
        "permissions": [
            "rep1",
            "rep2"
        ],
        "children": [
            {
                "text": "Reports",
                "icon": "layout",
                "permissions": [
                    "rep1"
                ],
                "route": "reports/reports"
            },
            {
                "text": "NewSelectionPanel",
                "icon": "layout",
                "permissions": [
                    "rep2"
                ],
                "route": "reports/reportsNew"
            }
        ]
    },
    {
        "text": "Static Data",
        "icon": "parameters",
        "permissions": [
            "cou",
            "cou-allo",
            "no1",
            "no2",
            "no3"
        ],
        "children": [
            {
                "text": "Geographic Defs",
                "permissions": [
                    "cou",
                    "cou-allo"
                ],
                "maticon": "settings",
                "children": [
                    {
                        "text": "Country",
                        "maticon": "grid_view",
                        "permissions": [
                            "cou"
                        ],
                        "route": "static-data/country"
                    },
                    {
                        "text": "Country Allocation",
                        "maticon": "grid_view",
                        "permissions": [
                            "cou-allo"
                        ],
                        "route": "static-data/group-to-country"
                    }
                ]
            },
            {
                "text": "Node Defs",
                "maticon": "settings",
                "permissions": [
                    "no1",
                    "no2",
                    "no3"
                ],
                "children": [
                    {
                        "text": "Node Category",
                        "maticon": "grid_view",
                        "permissions": [
                            "no1"
                        ],
                        "route": "static-data/category"
                    },
                    {
                        "text": "Node Class",
                        "maticon": "grid_view",
                        "permissions": [
                            "no2"
                        ],
                        "route": "static-data/node-class"
                    },
                    {
                        "text": "Node Classification",
                        "maticon": "grid_view",
                        "permissions": [
                            "no3"
                        ],
                        "route": "static-data/classification"
                    }
                ]
            }
        ]
    }
]