嵌套在Foreach中的Map函数的行为不符合Expected Why?

时间:2016-06-24 20:58:06

标签: javascript arrays multidimensional-array data-structures underscore.js

本质上,我试图遍历一组角色,并将其相关权限与主列表数组进行比较,并在此循环中设置布尔值。所以我想改变我正在循环的原始数组,从主列表中添加不存在的值,并为原始值设置真正的键值对,并为添加的值设置假键值对。我可以控制注销循环中的所有数据,我写的代码似乎按照我的预期进行,直到我注销最终结果,其中两个嵌套数组都包含上一次循环的布尔值。我对地图的理解肯定存在一些差距。我也觉得必须有一个更简单的方法来做这个没有嵌套(我正在努力学习如何避免或重构)。

示例代码:

 let roles = [];
    let allPerms = [];
    roles.push({
     name: 'role 1',
     label: 'role-label-1',
 permissions: [
    {
    name: 'permission 1',
    label: 'permission-1'
  },
  {
    name: 'permission 2',
    label: 'permission-2'
  }]
},
{
 name: 'role 2',
 label: 'role-label-2',
 permissions: [
    {
    name: 'permission 3',
    label: 'permission-3'
  },
  {
    name: 'permission 4',
    label: 'permission-4'
  }]
});

allPerms.push({
    name: 'permission 1',
    label: 'permission-1'
  },
  {
    name: 'permission 2',
    label: 'permission-2'
  },
  {
    name: 'permission 3',
    label: 'permission-3'
  },
  {
    name: 'permission 4',
    label: 'permission-4'
  });

console.log(roles);
console.log(allPerms);

function setRoles() {
  roles.forEach(function (val, key, array) {
      let selected = _.difference(array[key].permissions, allPerms);
      let mappedPerms = allPerms.map( function(v, k) {
          let name = _.find(selected, function(i) {
              return i.name == v.name;
          });
          if (typeof name != "undefined" && name.name == v.name) {
              v.selected = true;
          } else if (typeof name == "undefined"){
              v.selected = false;
          }
          return v;
      });
      console.log('ROLE '+key);
      console.log(mappedPerms[0].selected);
      console.log(mappedPerms[0].name);
      console.log(mappedPerms[1].selected);
      console.log(mappedPerms[1].name);
      console.log(mappedPerms[2].selected);
      console.log(mappedPerms[2].name);
      console.log(mappedPerms[3].selected);
      console.log(mappedPerms[3].name);
      array[key].permissions = mappedPerms
  });
  return roles;
}

let testRoles = setRoles();
console.log(testRoles);

这是一个jSFiddle问题的工作示例: https://jsfiddle.net/patrickisgreat/fu3hza1w/1/

预期产出:

[
  {
    "name": "role 1",
    "label": "role-label-1",
    "permissions": [
      {
        "name": "permission 1",
        "label": "permission-1",
        "selected": true
      },
      {
        "name": "permission 2",
        "label": "permission-2",
        "selected": true
      },
      {
        "name": "permission 3",
        "label": "permission-3",
        "selected": false
      },
      {
        "name": "permission 4",
        "label": "permission-4",
        "selected": false
      }
    ]
  },
  {
    "name": "role 2",
    "label": "role-label-2",
    "permissions": [
      {
        "name": "permission 1",
        "label": "permission-1",
        "selected": false
      },
      {
        "name": "permission 2",
        "label": "permission-2",
        "selected": false
      },
      {
        "name": "permission 3",
        "label": "permission-3",
        "selected": true
      },
      {
        "name": "permission 4",
        "label": "permission-4",
        "selected": true
      }
    ]
  }
]

1 个答案:

答案 0 :(得分:2)

Array.prototype.some可能对您有用。我们在forEach上映射allPerms角色并重建角色的权限。 role.permissions.some可用于检查角色上给定权限的预先存在。

function setRoles() {

  roles.forEach(function (role) {

    role.permissions = allPerms.map(function (perm) {

      return {
        name: perm.name,
        label: perm.label,
        selected: role.permissions.some(function (rolePerm) {
          return rolePerm.name === perm.name
        })
      }
    })
  })
}