在JavaScript中过滤对象的非重复/映射数组?

时间:2020-08-13 23:04:52

标签: javascript arrays

我有一个对象数组,我想从中过滤不同的电影标题并创建另一个对象数组。

    var movs = [
        {
            "Id": 3446,
            "FilmId": "ST00000358",
            "FilmPackageId": null,
            "Title": "Harry Potter and the Goblet of Fire",
        },
        {
            "Id": 3447,
            "FilmId": "ST00000358",
            "FilmPackageId": null,
            "Title": "Harry Potter and the Goblet of Fire",
        },
        {
            "Id": 3448,
            "FilmId": "ST00000359",
            "FilmPackageId": null,
            "Title": "Harry Potter and the Order of the Phoenix",
        },
        {
            "Id": 3449,
            "FilmId": "ST00000360",
            "FilmPackageId": null,
            "Title": "Spider-Man: Into The Spider-Verse",
        },
        {
            "Id": 3450,
            "FilmId": "ST00000360",
            "FilmPackageId": null,
            "Title": "Spider-Man: Into The Spider-Verse",
        }
    ]

我想创建一个对象数组,这些对象会过滤到不同的电影标题及其ID。


    [
        {
            Title: 'Harry Potter and the Goblet of Fire',
            FilmId: 'ST00000358'
        },
        {
            Title: 'Harry Potter and the Order of the Phoenix',
            FilmId: 'ST00000359'
        },
        {
            Title: 'Spider-Man: Into The Spider-Verse',
            FilmId: 'ST00000360'
        }
    ]

我已经成功获得了带有以下内容的不同标题的数组,但是如果我向地图添加其他字段,它将返回整个数组,而不是少数几个。


    const movies = [...new Set(movs.map(item => item.Title))];

这不起作用:

const movies = [
    ...new Set(
      movs.map((obj) => ({ label: obj.Title, value: obj.FilmId }))
    )
  ];

3 个答案:

答案 0 :(得分:2)

这是由JS比较对象和字符串(按值的字符串,按引用的对象)的方式引起的,所以

{k:1} === {k:1} === false

为了获得这种设置,可以使用诸如reduce的方法:

var movs = [
   {
       "Id": 3446,
       "FilmId": "ST00000358",
       "FilmPackageId": null,
       "Title": "Harry Potter and the Goblet of Fire",
   },
   {
       "Id": 3447,
       "FilmId": "ST00000358",
       "FilmPackageId": null,
       "Title": "Harry Potter and the Goblet of Fire",
   },
   {
       "Id": 3448,
       "FilmId": "ST00000359",
       "FilmPackageId": null,
       "Title": "Harry Potter and the Order of the Phoenix",
   },
   {
       "Id": 3449,
       "FilmId": "ST00000360",
       "FilmPackageId": null,
       "Title": "Spider-Man: Into The Spider-Verse",
   },
   {
       "Id": 3450,
       "FilmId": "ST00000360",
       "FilmPackageId": null,
       "Title": "Spider-Man: Into The Spider-Verse",
   }
]

console.log(Object.values(movs.reduce((acc, {FilmId, Title}) => (acc[FilmId] = {Title, FilmId}, acc), {})));

答案 1 :(得分:1)

您可以使用filter根据特定的密钥Set,然后使用map

var movs = [{ "Id": 3446, "FilmId": "ST00000358", "FilmPackageId": null, "Title": "Harry Potter and the Goblet of Fire", }, { "Id": 3447, "FilmId": "ST00000358", "FilmPackageId": null, "Title": "Harry Potter and the Goblet of Fire", }, { "Id": 3448, "FilmId": "ST00000359", "FilmPackageId": null, "Title": "Harry Potter and the Order of the Phoenix", }, { "Id": 3449, "FilmId": "ST00000360", "FilmPackageId": null, "Title": "Spider-Man: Into The Spider-Verse", }, { "Id": 3450, "FilmId": "ST00000360", "FilmPackageId": null, "Title": "Spider-Man: Into The Spider-Verse", } ];
let set = new Set();
const res = movs.filter(({FilmId})=>!set.has(FilmId) && set.add(FilmId)).map(({Title,FilmId})=>({Title,FilmId}));
console.log(res);

答案 2 :(得分:0)

您甚至可以使用forEach来完成这项工作:

var movs = [{ "Id": 3446, "FilmId": "ST00000358", "FilmPackageId": null, "Title": "Harry Potter and the Goblet of Fire", }, { "Id": 3447, "FilmId": "ST00000358", "FilmPackageId": null, "Title": "Harry Potter and the Goblet of Fire", }, { "Id": 3448, "FilmId": "ST00000359", "FilmPackageId": null, "Title": "Harry Potter and the Order of the Phoenix", }, { "Id": 3449, "FilmId": "ST00000360", "FilmPackageId": null, "Title": "Spider-Man: Into The Spider-Verse", }, { "Id": 3450, "FilmId": "ST00000360", "FilmPackageId": null, "Title": "Spider-Man: Into The Spider-Verse", } ];

let sortedArray = [];
movs.forEach(({Title, FilmId}) => {return sortedArray[FilmId] = {Title, FilmId}});

console.log(Object.values(sortedArray));