javascript中的嵌套陣列映射和過濾-有解無憂

我正在設計一個系統，但我有一些瓶頸。

我有這樣的用戶陣列：

 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"],
      },
    ],
  },
];

我有這樣的 activeWorkspace 物件：

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

我需要過濾 users 陣列中作業區 _id 等于 activeWorkspace _id 的物件。

輸出必須是這樣的：

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

我怎樣才能做到這一點？

另外：如果我們要回傳一個陣列，而不是一個物件，應該怎么做呢？像那樣：

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

謝謝

uj5u.com熱心網友回復：

如果只有一場比賽。您需要使用 find()。在 find 方法中，您想使用 some() 來查找 _id 匹配項。

 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 with a modern approach
const active2 = users.find(({workspaces}) => workspaces.some(({_id}) => _id === activeWorkspace._id));

console.log(active2);

現在，如果可能有多個匹配項（拼寫錯誤之前的原始代碼），您將使用 filter() 和 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: "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 with a modern approach
const active2 = users.filter(({workspaces}) => workspaces.some(({_id}) => _id === activeWorkspace._id));

console.log(active2);

uj5u.com熱心網友回復：

我調整了 Joe 提供的資料，因此他沒有權限

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())

uj5u.com熱心網友回復：

您可以使用map和filter從users物件中“過濾”掉不需要的 id 。就像是：

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);

uj5u.com熱心網友回復：

這應該有效（經過測驗）：

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

說明：我們正在使用filter和reduce從代碼中可以看出。代碼所做的非常簡單，首先，我們要filter在用戶陣列上應用。現在在過濾器中，我們需要定義邏輯，true只要我們的條件碰巧為真，它就應該回傳。由于我們有一組作業區，我們需要遍歷所有作業區以檢查我們的 activeWorkspace._id 是否存在于其中任何一個中。為此，您可以使用 for 回圈并true在找到時回傳，否則回傳false。但是這樣做的功能方法是使用reduce和初始化累加器false。每次訪問作業區時，都會回傳acc || <our condition>. 請注意，即使我們的條件回傳 true，累加器也會變成true對于其余的執行reduce。這在性能上略差，因為您不會像在for回圈時那樣在找到 workspace._id 后立即退出。

uj5u.com熱心網友回復：

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

轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/376765.html

標籤：javascript 节点.js 数组

上一篇：PHP-按索引向多維陣列添加多個專案

下一篇：在主串列中搜索聚合結果