Angular TypeScript嵌套for循环优化：如何用map/reduce/filter简化逻辑

当然可行，原代码的嵌套循环+重复find查找会带来较高的时间复杂度（O(PRM)，P为权限数，R为角色数，M为现有权限角色关联数），我们可以通过预构建映射表结合数组高阶方法（map、reduce）来大幅优化性能和代码简洁度。

优化后的代码 #

fill() {
  this.rolesPermiAdd = [];
  this.rolPermiRemove = [];
  this.arrayRAndPern.subscribe((data: any) => {
    // 预构建权限-角色的映射集合，将匹配关系转为O(1)查找
    const rolePermiMap = this.rolPermi.reduce((map, item) => {
      const key = `${item.permission}-${item.role}`;
      map.add(key);
      return map;
    }, new Set<string>());

    // 用map生成二维的rolePermiCheck数组
    this.rolePermiCheck = this.permissions.map(permission => 
      this.roles.map(role => 
        rolePermiMap.has(`${permission.code}-${role.code}`)
      )
    );
  });
}

优化说明 #

• 预构建映射表：用reduce把rolPermi转成一个Set集合，存储所有已存在的权限code-角色code组合键，后续查找只需O(1)时间，避免了原代码中每次嵌套循环都要遍历整个rolPermi数组的开销。
• 高阶方法替代嵌套循环：外层用map遍历权限列表，内层再用map遍历角色列表，直接通过映射表判断是否存在关联，一行代码生成对应的布尔值数组，代码更简洁直观。
• 性能提升：优化后的时间复杂度降到O(M + PR)，对比原代码的O(PR*M)，在数据量较大时性能提升明显。

内容的提问来源于stack exchange，提问作者nickel