映射Json形成数组答案

【问题标题】：mapping Json to form an array映射Json形成数组
【发布时间】：2017-05-08 20:04:22
【问题描述】：

下面是我的 Json

"Issues": [
    {
        "Id": null,
        "Key": "Project20",
        "Values": [
            {
                "Key": "Display Name",
                "Value": "Rya"
            },
            {
                "Key": "UserName",
                "Value": "RH"
            },
            {
                "Key": "Count",
                "Value": "350"
            }
        ]
    },
    {
        "Id": null,
        "Key": "Project30",
        "Values": [
            {
                "Key": "Display Name",
                "Value": "Mike"
            },
            {
                "Key": "UserName",
                "Value": "ML"
            },
            {
                "Key": "Count",
                "Value": "90"
            }
        ]
    }
]

我需要将这个 Json 映射成下面的数组

{ "Display Name": 'Rya', "UserName" : "RH", value: 350, url: "Project20" },
{ "Display Name": 'Mike', "UserName" : "ML", value: 90, url:"Project30" }

基本上，我还需要在我的数组中获取密钥。

我试过了

Issues.map(o => o.Values.reduce((acc, {Key, Value}) => (acc[Key] = Value, acc), {}));

这给了我

{ "Display Name": 'Rya', "UserName" : "RH", value: 350 },
{ "Display Name": 'Mike', "UserName" : "ML", value: 90 }

但我还需要数组中的 Key 字段

【问题讨论】：

标签： javascript ecmascript-6

【解决方案1】：

使用reduce 的初始值参数。所以不是{} 而是通过{ url: o.Key }：

Issues.map(o => o.Values.reduce((acc, {Key, Value}) => (acc[Key] = Value, acc),
                                { url: o.Key }));

对于那些使用 IE 的用户，您需要使用 ES5 兼容的语法：

Issues.map(function (o) {
    return o.Values.reduce(function (acc, pair) {
        acc[pair.Key] = pair.Value;
        return acc;
    }, { url: o.Key });
});

var Issues = [
    {
        "Id": null,
        "Key": "Project20",
        "Values": [
            {
                "Key": "Display Name",
                "Value": "Rya"
            },
            {
                "Key": "UserName",
                "Value": "RH"
            },
            {
                "Key": "Count",
                "Value": "350"
            }
        ]
    },
    {
        "Id": null,
        "Key": "Project30",
        "Values": [
            {
                "Key": "Display Name",
                "Value": "Mike"
            },
            {
                "Key": "UserName",
                "Value": "ML"
            },
            {
                "Key": "Count",
                "Value": "90"
            }
        ]
    }
];

var result = Issues.map(function (o) {
    return o.Values.reduce(function (acc, pair) {
        acc[pair.Key] = pair.Value;
        return acc;
    }, { url: o.Key });
});

console.log(result);

【讨论】：

这在 IE 中有效吗？我无法测试它。如果它不起作用，是否有转换它的工具，就像我在代码的许多部分中使用的类似
你有机会看到我的评论吗
由于您在问题中提供了 ES6 语法并给出了结果，因此我假设您有 ES6 支持。请参阅我的答案的更新，其中包括 ES5 版本。
感谢 trincot。我最近才知道。谢谢你的帮助。有什么工具可以转换我的其他 ES6 代码。
是的，有：babeljs.io/repl 确保在预设下拉菜单中选择 ES2015。