如何消除angular中数组中的重复对象

Question

我正在尝试过滤重复值并将唯一值作为对象数组获取。我不知道如何根据颜色获得唯一值。下面是我的数据：

[
    {
        "code": "xxxx1",
     
        "priceData": {
            "currencyIso": "USD",
            "value": 649.99
        },
 
        "variants": [
            {
                "color": "#212028 |Black",
            }
        ]
    },
    {
        "code": "xx2",
        "priceData": {
            "currencyIso": "USD",
            "value": 999.99
        },

        "variants": [
            {
                "color": "#212028 |Black",
            },
        ]
    },
    {
        "code": "xx3",
        "priceData": {
            "currencyIso": "USD",
            "value": 549.99
        },
        "variants": [
            {
                "color": "#D3CCC1 |Silver",
            },
           
        ]
    },
    {
        "code": "xxx-4",

        "priceData": {
            "currencyIso": "USD",
            "value": 649.99
        },
   
        "variants": [
            {
                "color": "#D3CCC1 |Silver",
               
            }
        ]
    }
]

预期值为：

[
    {
        "code": "xxxx1",
     
        "priceData": {
            "currencyIso": "USD",
            "value": 649.99
        },
 
        "variants": [
            {
                "color": "#212028 |Black",
            }
        ]
    },
    {
        "code": "xx3",
        "priceData": {
            "currencyIso": "USD",
            "value": 549.99
        },
        "variants": [
            {
                "color": "#D3CCC1 |Silver",
            },
           
        ]
    },
   
]

下面的代码returns只有对象的变体数组。但我想要的是我上面提到的预期结果

  let variants2 = Array.from(
            new Set(
              variants.map(
                (a) => a.variants
              )
            )
          ).map((variants) => {
            return variants.find((a) => a.color=== a.color);
          });
          [
            ...new Map(variants2.map((item) => [item.value, item])).values(),
          ];

谁能帮我解决这个问题？

Answer 1

许多可能的方法之一（输入数组称为 items）：

Array.from(new Map(items.reverse().map(item => [item.variants[0].color, item])).values()).reverse();

测试：

const items = [
    {
        "code": "xxxx1",
     
        "priceData": {
            "currencyIso": "USD",
            "value": 649.99
        },
 
        "variants": [
            {
                "color": "#212028 |Black",
            }
        ]
    },
    {
        "code": "xx2",
        "priceData": {
            "currencyIso": "USD",
            "value": 999.99
        },

        "variants": [
            {
                "color": "#212028 |Black",
            },
        ]
    },
    {
        "code": "xx3",
        "priceData": {
            "currencyIso": "USD",
            "value": 549.99
        },
        "variants": [
            {
                "color": "#D3CCC1 |Silver",
            },
           
        ]
    },
    {
        "code": "xxx-4",

        "priceData": {
            "currencyIso": "USD",
            "value": 649.99
        },
   
        "variants": [
            {
                "color": "#D3CCC1 |Silver",
               
            }
        ]
    }
];
const items2 = Array.from(new Map(items.reverse().map(item => [item.variants[0].color, item])).values()).reverse();
console.log(items2);

注意items.reverse()原地反转原数组。如果您需要其原始订单，则必须再次调用 items.reverse()（在创建 items2 之后）。

对于每种独特的颜色，此方法将 first 对象放入结果中，如您的示例所示。如果获取 last 对象也可以，您可以从上面的代码中删除两个 .reverse() 调用：

Array.from(new Map(items.map(item => [item.variants[0].color, item])).values());

如何消除angular中数组中的重复对象

How to eleminate the duplicate objects within the array in angular

javascript

filter

ecmascript-6

es6-map

angular