DEV Community

Cover image for Introducing Object.fromEntries

Introducing Object.fromEntries

Laurie on July 02, 2019

I've been loving this series because it gives me the opportunity to really dive into some of these new features. Today, we're looking at Object.fr...
Collapse
 
yuetsu profile image
yuetsu

Great write up & explanation, thank you! One possible typo — in your final code example, you say —

This means Object.fromEntries can cause you to drop information.

However, in the code example that follows, you have —

const arr = [['a', 1], ['a', 2], ['c', 3]]
const entries = Object.entries(arr)
// {a: 2, c: 3}

... shouldn't that be, on the 2nd line — const entries = Object.fromEntries(arr) ??

Thought you'd want to know. But this is great and I learned a lot from both this and your other guide on for...in (Objects) and for...of (Arrays). Keep up the great work!

Collapse
 
laurieontech profile image
Laurie

Thanks for catching that! I’ll take a look.

Collapse
 
jsmccrumb profile image
Jacob McCrumb

Thanks for the writeup! Worth noting this is already in Chrome, Firefox, Node 12 but not Edge:

MDN Object.fromEntries

Without it I have been using reduce to make an object from array of key-value pairs... this will be a lot easier!

Collapse
 
ggenya132 profile image
Eugene Vedensky

To no one's surprise, not Edge.

Collapse
 
laurieontech profile image
Laurie

Definitely worth noting! Thanks for that.

Collapse
 
treddson profile image
Taylor Short

Thank you so much for this article! Learned something new today. I think there may be a typo here:

But without Object.forEntries we're stuck with our transformation in an Array structure. With its addition, we can do this instead!..

where you said Object.forEntries instead of Object.fromEntries.

Collapse
 
laurieontech profile image
Laurie

Ah, thank you! Will fix that one.

Collapse
 
ggenya132 profile image
Eugene Vedensky

Oddly enough, what I found most helpful was the example of destructuring array arguments during the map, it's not a pattern I see very often in my to see an array containing arrays, but that syntax will be incredibly helpful.

Collapse
 
laurieontech profile image
Laurie
Collapse
 
jnschrag profile image
Jacque Schrag

This is fantastic! No more having to use .reduce to convert an array back into an Object. 🎉 I know this isn't yet supported in Edge - is there a polyfill for it?

Collapse
 
laurieontech profile image
Laurie

So it looks like it might be supported by Edge? At least according to this.
github.com/feross/fromentries

Collapse
 
jnschrag profile image
Jacque Schrag

I think they mean the ponyfill is supported in Edge. But maybe not! The wording is kind of ambiguous there.

Thread Thread
 
laurieontech profile image
Laurie

Agreed.

Collapse
 
eshunsharma profile image
Eshun Sharma

Great article. I didn't know we could turn an array into an object with this :)