Convert es6 map's content to an array of JSON

Question

I have a Map that is set up like this

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 } );

I wish to transform this to an array of jsons with a new property "name" for each of the key from the map:

[
  { "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 }
]

I tried JSON.stringify([...directory]) and bunch of other stuff but the not sure of any efficient way of including the key as part of the json.

I'm going to go out on a limb here and assume by "array of jsons" you mean "array of objects." JSON is a textual notation for data exchange. (More here.) If you're dealing with JavaScript source code, and not dealing with a string, you're not dealing with JSON. — T.J. Crowder
– T.J. Crowder, Commented Sep 18, 2017 at 16:34
What have you tried? What has your research turned up? What part are you stuck on? — T.J. Crowder
– T.J. Crowder, Commented Sep 18, 2017 at 16:35

Jonas Wilms · Accepted Answer · 2017-09-18 16:47:11Z

2

As you already used the spread property to destructure the Map, you then just need to map that 2d array to an array of objects, which can be easily done with array destructuring:

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

or without ESnext:

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

Try it

edited Sep 18, 2017 at 16:47

answered Sep 18, 2017 at 16:39

Jonas Wilms

139k20 gold badges164 silver badges164 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

T.J. Crowder Over a year ago

Quite so, no reason not to use spread instead of Array.from. As you say, spread properties (lurkers: the second use of ...) are only Stage 3, so they'll probably (but only probably) make ES2018 -- but they're well-supported by transpilers.

T.J. Crowder Over a year ago

I don't normally upvote when there's no explanation, though. (Did this time.)

Nina Scholz · Accepted Answer · 2017-09-18 16:43:49Z

0

You could use Array.from and build the wanted objects.

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; }

answered Sep 18, 2017 at 16:43

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

Collectives™ on Stack Overflow

Convert es6 map's content to an array of JSON

2 Answers 2

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related