将 es6 地图的内容转换为 JSON 数组答案

【问题标题】：Convert es6 map's content to an array of JSON将 es6 地图的内容转换为 JSON 数组
【发布时间】：2017-09-18 16:33:14
【问题描述】：

我有一个这样设置的地图

const directory = new Map()
.set('John', { age:25, gender: 'M'} )
.set('Mary', { age:51, gender: 'M'} ) 
.set('Sam', { age:15, gender: 'M', id: 322 } )
.set('Jane', { age:15, gender: 'M', paid: true } );

我希望将其转换为一个 json 数组，并为地图中的每个键添加一个新属性“名称”：

[
  { "name": "John", "age":25, "gender": "M" },
  { "name": "Mary", "age":51, "gender": "F" },  
  { "name": "Sam", "age":15, "gender": "M", "id": 322 },  
  { "name": "Jane", "age":19, "gender": "F", "paid": true }
]

我尝试了 JSON.stringify([...directory]) 和其他一堆东西，但不确定将密钥作为 json 的一部分包含在内的任何有效方法。

【问题讨论】：

我将在这里冒险并假设“jsons数组”您的意思是“对象数组”。 JSON 是一种用于数据交换的文本符号。 (More here.) 如果您正在处理 JavaScript 源代码，而不是处理 string，那么您就不是在处理 JSON。
你试过什么？你的研究结果是什么？你卡在哪一部分了？

标签： javascript json ecmascript-6

【解决方案1】：

由于您已经使用了 spread 属性来解构 Map，因此您只需将该二维数组映射到对象数组，这可以通过数组解构轻松完成：

 [...directory].map(([name,obj]) => ({name,...obj}));

或者没有ESnext：

[...directory].map(([name,obj]) => Object.assign({name},obj));

Try it

【讨论】：

确实如此，没有理由不使用 spread 而不是 Array.from。正如你所说，传播 properties （潜伏者：... 的第二次使用）只是第 3 阶段，所以他们可能（但只是可能）制作 ES2018——但他们得到了很好的支持通过转译器。
不过，当有 no 解释时，我通常不会投票。（这次做了。）

【解决方案2】：

您可以使用Array.from 并构建想要的对象。

const directory = new Map()
        .set('John', { age: 25, gender: 'M' })
        .set('Mary', { age: 51, gender: 'M' }) 
        .set('Sam', { age: 15, gender: 'M', id: 322 })
        .set('Jane', { age: 15, gender: 'M', paid: true }),
    result = Array.from(directory, ([name, o]) => Object.assign({ name }, o));
    
console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

【讨论】：