How To Convert An Object To An Array In Vanilla Javascript

I do quite a lot of work with Firebase and when you are working with authentication claims, they will be returned as an object containing your simple values (usually booleans).

Thankfully, since ES2015 landed, each Javascript release has introduced a new and easier way to work with objects and convert them into arrays. You don’t need any libraries like Lodash, this is all native and well-supported vanilla Javascript.

To convert an object of properties and values, you can use Object.entries however, it will return an array of arrays, which isn’t terrible but might confuse Javascript novices as to how you would even work with these.

const claims = {
    admin: true,
    superAdmin: false
};

const claimsArray = Object.entries(claims);

Now, if you were to console.log claims array from above, this is what you would get.

[
  [
    "admin",
    true
  ],
  [
    "superAdmin",
    false
  ]
]

To work with this nested array, you can simply use a for..of loop like this:

for (const [key, value] of claimsArray) {
    console.log(key, value)
}

The key is the object property name and the value is the value.

It’s amazing how easy modern Javascript makes doing things like these. To think only a few short years ago we were still using jQuery, supporting old versions of Internet Explorer and crying out for a better web.