如何在javascript（es6）中将对象属性数组变平为具有array的数组？

Question

给定一个树形对象：

• 用户具有许多角色。
• 角色具有许多PermissionCollection
• PermissionCollection具有许多权限

您如何使用javascript使其扁平化，并最终获得一系列权限

就像是：

user.roles.map(r = r.permissionGroups).flatten().reduce(pg => pg.permissions).flatten();

那是经典的地图减少问题吗？

Answer 1

这是一个（浅）展平函数：

var flatten = array => array.reduce( ( a, b ) => a.concat( b ), [] );

您可以像这样应用它。

var permissionGroups = flatten( user.roles.map( r => r.permissionGroups ) );
var permissions = flatten( permissionGroups.map( pg => pg.permissions ) );

Answer 2

您是正确的， reduce()可能会给出最干净的方法。

您可以将concat()组合在一起：

const allPermissions = user.roles.reduce((r, role) => 
  r.concat(role.permissionGroups.reduce((r, group) => 
    r.concat(group.permission), []), 
  []);

请注意，实际上每次返回时都会创建一个新数组，因此，如果角色很多，效率可能会有些低。 要做到这一点而不必每次都创建新数组，可以改用push.apply() ：

const allPermissions = user.roles.reduce((r, role) => 
  r.push.apply(r, role.permissisionGroups.reduce((r, group) => 
    r.push.apply(r, group.permissions), []), 
  []);

使用apply()将允许您将权限作为参数传递（基本上与调用push()相同）。 如果您尝试推送一个数组，它将把它推送为一个数组，而不是单个值。

如果要更进一步，并始终保持一个阵列，可以使用：

const allPermissions = []; user.roles.forEach（角色=> role.permissionGroups.forEach（group => allPermissions.push.apply（allPermissions，group.permissions）））

从本质上讲，这仍然是一个reduce()模式，但是不会创建很多额外的值。 如果您想使用reduce() ，它可能看起来像这样：

const allPermissions = user.roles.reduce((r, role) =>
  r.push.apply(r, role.permissionGroups.reduce((r, group) =>
    r.push.apply(r, group.permissions)), r), 
  []
);