javascript 中的嵌套数组映射和过滤

Question

I am designing a system and I have some bottlenecks.

I have user array such like that:

 const users = [
  {
    name: "Jack",
    workspaces: [
      {
        _id: "61216512315615645jbk",
        permissions: ["CAN_DELETE_WORKSPACE", "CAN_EDIT_PROJECT"],
      },
      {
        _id: "41ss16512315615645bk",
        permissions: ["CAN_DELETE_WORKSPACE", "CAN_EDIT_PROJECT"],
      },
    ],
  },
  {
    name: "Joe",
    workspaces: [
      {
        _id: "71216512315615645jbk",
        permissions: ["CAN_DELETE_WORKSPACE"],
      },
    ],
  },
];

And I have activeWorkspace object such like that:

const activeWorkspace = {
  name: "W1",
  _id: "61216512315615645jbk",
};

I need to filter the objects in the users array whose workspace _id is equal to activeWorkspace _id.

Output must be like that:

{
    name: "Jack",
    workspaces: [
      {
        _id: "61216512315615645jbk",
        permissions: ["CAN_DELETE_WORKSPACE", "CAN_EDIT_PROJECT"],
      },
      {
        _id: "41ss16512315615645bk",
        permissions: ["CAN_DELETE_WORKSPACE", "CAN_EDIT_PROJECT"],
      },
    ],
}

How can I do that?

In addition: If we want to return an array, not an object, how should we do it? Like that:

[{
        name: "Jack",
        workspaces: [
          {
            _id: "61216512315615645jbk",
            permissions: ["CAN_DELETE_WORKSPACE", "CAN_EDIT_PROJECT"],
          },
          {
            _id: "41ss16512315615645bk",
            permissions: ["CAN_DELETE_WORKSPACE", "CAN_EDIT_PROJECT"],
          },
        ],
}]

Thanks

Answer 1

The approach is to use filter() and some() to find what users have the workspace

 const users = [ { name: "Jack", workspaces: [ { _id: "61216512315615645jbk", permissions: ["CAN_DELETE_WORKSPACE", "CAN_EDIT_PROJECT"], }, { _id: "41ss16512315615645bk", permissions: ["CAN_DELETE_WORKSPACE", "CAN_EDIT_PROJECT"], }, ], }, { name: "Joe", workspaces: [ { _id: "61216512315615645jbk", permissions: ["CAN_DELETE_WORKSPACE"], }, ], }, ]; const activeWorkspace = { name: "W1", _id: "61216512315615645jbk", }; const active = users.filter(function (user) { return user.workspaces.some( function (workspace) { return workspace._id === activeWorkspace._id; }); }); console.log(active); // Same thing as above, just done without a modern approach const active2 = users.filter(({workspaces}) => workspaces.some(({_id}) => _id === activeWorkspace._id)); console.log(active2);

If there can only be one (your sample data has a typo?) then you can can use find() and some()

 const users = [ { name: "Jack", workspaces: [ { _id: "61216512315615645jbk", permissions: ["CAN_DELETE_WORKSPACE", "CAN_EDIT_PROJECT"], }, { _id: "41ss16512315615645bk", permissions: ["CAN_DELETE_WORKSPACE", "CAN_EDIT_PROJECT"], }, ], }, { name: "Joe", workspaces: [ { _id: "CHANGED_ID", permissions: ["CAN_DELETE_WORKSPACE"], }, ], }, ]; const activeWorkspace = { name: "W1", _id: "61216512315615645jbk", }; const active = users.find(function (user) { return user.workspaces.some( function (workspace) { return workspace._id === activeWorkspace._id; }); }); console.log(active); // Same thing as above, just done without a modern approach const active2 = users.find(({workspaces}) => workspaces.some(({_id}) => _id === activeWorkspace._id)); console.log(active2);

Answer 2

I adjusted the provided data from Joe so he doesn't have permissions

 const users = [{ name: "Jack", workspaces: [{ _id: "61216512315615645jbk", permissions: ["CAN_DELETE_WORKSPACE", "CAN_EDIT_PROJECT"], }, { _id: "41ss16512315615645bk", permissions: ["CAN_DELETE_WORKSPACE", "CAN_EDIT_PROJECT"], }, ], }, { name: "Joe", workspaces: [{ _id: "61216512315615645bk", permissions: ["CAN_DELETE_WORKSPACE"], }, ], }, ]; const activeWorkspace = { name: "W1", _id: "61216512315615645jbk", }; function findPermittedUser() { return users.filter(user => { let hasPermission = false user.workspaces.forEach(workspace => { if (activeWorkspace._id == workspace._id) { hasPermission = true } }) return hasPermission }) } console.log(findPermittedUser())

Answer 3

You can use map and filter to "filter" out the unwanted ids from the users object. Something like:

 const users = [ { "name": "Jack", "workspaces": [ { "_id": "61216512315615645jbk", "permissions": [ "CAN_DELETE_WORKSPACE", "CAN_EDIT_PROJECT" ] }, { "_id": "41ss16512315615645bk", "permissions": [ "CAN_DELETE_WORKSPACE", "CAN_EDIT_PROJECT" ] } ] }, { "name": "Joe", "workspaces": [ { "_id": "61216512315615645jbk", "permissions": [ "CAN_DELETE_WORKSPACE" ] } ] } ] const activeWorkspace = { name: "W1", _id: "61216512315615645jbk", }; const filteredUsers = users.map(item => ({ name: item.name, workspaces: item.workspaces.filter(user => user._id === activeWorkspace._id)} )); console.log(filteredUsers);

Answer 4

This should work (tested):

const filteredUsers = users.filter(
 user => user.workspaces.reduce(
  (acc, workspace) => acc || workspace._id === activeWorkspace._id, false)
 )
)

Explanation: We are using filter and reduce as evident from the code. What the code is doing is pretty simple, first, we want to apply filter on the user array. Now in the filter, we need to define the logic, which should return true whenever our condition happens to be true. Since we have an array of workspaces, we need to iterate over all of them to check if our activeWorkspace._id exists in any of them. For this, you can use a for loop and return true when you find it, else return false if not. But the functional way of doing it would be to use reduce and initialize the accumulator with false . Every time you access a workspace, you return acc || <our condition> acc || <our condition> . Notice how if even once our condition returns true, the accumulator becomes true for the rest of the execution of reduce . This is slightly poor in performance since you are not exiting as soon as you have found your workspace._id as you would have done in case of a for loop.

Answer 5

users.map(u => u.workspaces).flat().filter(w => w._id === activeWorkspaceId);

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/flat