Javascript：按id過濾兩個物件陣列并回傳特定值-有解無憂

我正在嘗試通過它們的 id ( id& userId) 過濾這兩個物件陣列。

我只想回傳id和userId等于的標題

謝謝！

const usersData = [
  {
    "id": 1,
    "name": "Leanne Graham",
    "username": "Bret",
    "email": "[email protected]",
  }
]

const albumsData = [
  {
    "userId": 1,
    "id": 1,
    "title": "FooBar"
  },
  {
    "userId": 1,
    "id": 2,
    "title": "Trolololo"
  },
  {
    "userId": 3,
    "id": 3,
    "title": "omnis laborum odio"
  },
  {
    "userId": 4,
    "id": 4,
    "title": "non esse culpa molestiae omnis sed optio"
  }
]

const results = usersData.map(({ id }) =>
    albumsData.filter(({ userId }) => id === userId)
  );

console.log(results);

uj5u.com熱心網友回復：

您的代碼看起來不錯，但會回傳一個嵌套陣列，所以只需使用flatMap而不是map. 如果您只想要標題，只需將另一個鏈接.map到它：

const usersData = [{"id": 1,"name": "Leanne Graham","username": "Bret","email": "[email protected]",}];
const albumsData = [{"userId": 1,"id": 1,"title": "FooBar"},{"userId": 1,"id": 2,"title": "Trolololo"},{"userId": 3,"id": 3,"title": "omnis laborum odio"},{"userId": 4,"id": 4,"title": "non esse culpa molestiae omnis sed optio"}];

const results = usersData.flatMap(({ id }) =>
    albumsData.filter(({ userId }) => id === userId)
).map(({title}) => title);

console.log(results);

uj5u.com熱心網友回復：

const result = albumData.filter((data) => data.userId === usersData[0].id);

uj5u.com熱心網友回復：

正如已經指出的那樣，您將使用map. 但如果您將另一個專案添加到陣列中，這實際上可能是需要的，usersData因為您將獲得按索引分組的結果。如果沒有，請在最后使用flatMap另一個map來獲得標題。

const results = usersData.flatMap(({ id }) =>
    albumsData.filter(({ userId }) => id === userId)
  ).map(entry=>entry.title)

產量：

["FooBar","Trolololo"]

uj5u.com熱心網友回復：

也許您只想要標題值？在這種情況下，您的代碼是 find 但只是從中獲取標題，即：可能不是最有效的，但最后的詳細部分可能會告訴您那里發生了什么。

const usersData = [{
  "id": 1,
  "name": "Leanne Graham",
  "username": "Bret",
  "email": "[email protected]",
}];

const albumsData = [{
    "userId": 1,
    "id": 1,
    "title": "FooBar"
  },
  {
    "userId": 1,
    "id": 2,
    "title": "Trolololo"
  },
  {
    "userId": 3,
    "id": 3,
    "title": "omnis laborum odio"
  },
  {
    "userId": 4,
    "id": 4,
    "title": "non esse culpa molestiae omnis sed optio"
  }
];

const results = usersData.map(({
    id
  }) =>
  albumsData.filter(({
    userId
  }) => id === userId)
);
console.log(results);
// an array of titles
var titles = results[0].map((el) => {return el.title;});
console.log(titles);

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

標籤：javascript 数组目的筛选

上一篇：對資料關鍵元素運行特定檢查

下一篇：REACT組件呈現然后消失