如何使用下划线js转换这些数据

How can I transform this data using underscore js?

本文关键字：数据转换 js 何使用下划线更新时间：2023-09-26

我有一些数据是从REST API返回给我的。我希望它在我的Angular 2应用程序的特定格式。

如何使用下划线js执行以下数据转换？

从REST API返回的数据：

[    
    {
        "ProductVariantID": "133",
        "ProductID": "259",
        "ProductGender": "Male",
        "Size": "17.5",
        "Color": "Red",
        "MSRP": "0",
        "MAP": "0",
        "UPC": "99999106"
    },
    {
        "ProductVariantID": "128",
        "ProductID": "259",
        "ProductGender": "Male",
        "Size": "17.5",
        "Color": "Blue",
        "MSRP": "0",
        "MAP": "0",
        "UPC": "99999101"
    },
    {
        "ProductVariantID": "130",
        "ProductID": "259",
        "ProductGender": "Male",
        "Size": "19.5",
        "Color": "Blue",
        "MSRP": "0",
        "MAP": "0",
        "UPC": "99999103"
    },
    {
        "ProductVariantID": "129",
        "ProductID": "259",
        "ProductGender": "Male",
        "Size": "18.5",
        "Color": "Blue",
        "MSRP": "0",
        "MAP": "0",
        "UPC": "99999102"
    },
    {
        "ProductVariantID": "132",
        "ProductID": "259",
        "ProductGender": "Male",
        "Size": "15.5",
        "Color": "Red",
        "MSRP": "0",
        "MAP": "0",
        "UPC": "99999105"
    },    
    {
        "ProductVariantID": "131",
        "ProductID": "259",
        "ProductGender": "Male",
        "Size": "21.5",
        "Color": "Blue",
        "MSRP": "0",
        "MAP": "0",
        "UPC": "99999104"
    },
    {
        "ProductVariantID": "127",
        "ProductID": "259",
        "ProductGender": "Male",
        "Size": "15.5",
        "Color": "Blue",
        "MSRP": "0",
        "MAP": "0",
        "UPC": "99999100"
    }       
]

我想把它转换成以下内容。请注意，顶级数组是根据其对象的"Color"属性按字母顺序排序的，Variants数组是根据对象的"Size"属性按数字排序的。本质上，我想要一个新的对象数组，按颜色分组，并在"Variants"数组属性中包含原始对象。

期望输出：

[
    {
        "Color": "Blue",
        "Variants": [
             {
                "ProductVariantID": "127",
                "ProductID": "259",
                "ProductGender": "Male",
                "Size": "15.5",
                "Color": "Blue",
                "MSRP": "0",
                "MAP": "0",
                "UPC": "99999100"
            },
            {
                "ProductVariantID": "128",
                "ProductID": "259",
                "ProductGender": "Male",
                "Size": "17.5",
                "Color": "Blue",
                "MSRP": "0",
                "MAP": "0",
                "UPC": "99999101"
            },
            {
                "ProductVariantID": "129",
                "ProductID": "259",
                "ProductGender": "Male",
                "Size": "18.5",
                "Color": "Blue",
                "MSRP": "0",
                "MAP": "0",
                "UPC": "99999102"
            },
            {
                "ProductVariantID": "130",
                "ProductID": "259",
                "ProductGender": "Male",
                "Size": "19.5",
                "Color": "Blue",
                "MSRP": "0",
                "MAP": "0",
                "UPC": "99999103"
            },
            {
                "ProductVariantID": "131",
                "ProductID": "259",
                "ProductGender": "Male",
                "Size": "21.5",
                "Color": "Blue",
                "MSRP": "0",
                "MAP": "0",
                "UPC": "99999104"
            }      
        ],            
    }
    {
        "Color": "Red",
        "Variants": [
             {
                "ProductVariantID": "132",
                "ProductID": "259",
                "ProductGender": "Male",
                "Size": "15.5",
                "Color": "Red",
                "MSRP": "0",
                "MAP": "0",
                "UPC": "99999101"
            },  
            {
                "ProductVariantID": "133",
                "ProductID": "259",
                "ProductGender": "Male",
                "Size": "17.5",
                "Color": "Red",
                "MSRP": "0",
                "MAP": "0",
                "UPC": "99999101"
            },      
        ],            
    }
]

您可以在分组后使用映射来创建所需的输出

var temp1=_.groupBy(result, 'Color');
_.map(temp1,function(item,key){return {'Color':key,'Variants':item}});