Converting Object to Array using ES6 features

Question

Given a javascript object, how can I convert it to an array in ECMAScript-6 ?

For example, given:

 var inputObj = {a:'foo', b:[1,2,3], c:null, z:55};

The expected output would be:

 ['foo', [1,2,3], null, 55]

The order of the elements in the result is not important to me.

Answer 1

Use (ES5) Array::map over the keys with an arrow function (for short syntax only, not functionality):

let arr = Object.keys(obj).map((k) => obj[k])

---

True ES6 style would be to write a generator, and convert that iterable into an array:

function* values(obj) {
    for (let prop of Object.keys(obj)) // own properties, you might use
                                       // for (let prop in obj)
        yield obj[prop];
}
let arr = Array.from(values(obj));

Regrettably, no object iterator has made it into the ES6 natives.

Answer 2

just use Object.values

Object.values(inputObj); // => ['foo', [1,2,3], null, 55]

Answer 3

Update August 2020

As a summary, in ES6, there are three (3) variations to convert an Object to an Array as follows:

const MyObjects = {   key1: 'value 1',   key2: 'value 2', };

// Method 1: Converts the keys to Array
// --------------------------------------

Object.keys(MyObjects);
// ['key1', 'key2']

// Method 2 Converts the Values to Array
// --------------------------------------

Object.values(MyObjects);
// ['value 1', 'value 2']

// Method 3 Converts both Values and Keys
// --------------------------------------

Object.entries(MyObjects);
// [ ['key1', 'value 1'], ['key2', 'value 2'] ]

Converting an Array back to an Object can be done as follows:

const array = [  ['one', 1],   ['two', 2], ];

Object.fromEntries(array);

// { one: 1, two: 2 }

Answer 4

I like the old school way:

var i=0, arr=[];
for (var ob in inputObj)
  arr[i++]=ob;

Old school wins the jsperf test by a large margin, if not the upvotes. Sometimes new additions are "mis-features."

Answer 5

This can be achieved using the Array Comprehension syntax:

[for (key of Object.keys(inputObj)) inputObj[key]]

Usage example:

var inputObj = {a:'foo', b:[1,2,3], c:null, z:55};
var arr = [for (key of Object.keys(inputObj)) inputObj[key]];
console.log(arr);

// prints [ 'foo', [ 1, 2, 3 ], null, 55 ]

Answer 6

ES7 way:

let obj = { a: "foo", b: "bar", c: 1, d: [1, 2, 3, 4] }

Object.values(obj)

// output --> ['foo', 'bar', 1, [1, 2, 3, 4]

Answer 7

Array.map equivalent of @Bergi's arrow function (see MDN for more about Array.map).

Edit 2020: converted to snippet and added an alternative

const obj = {
    a: 'foo',
    b: [1, 2, 3],
    c: null,
    z: 55
  },
  nwArr = Object.keys(obj).map(k => obj[k]),
  // Alternative
  nwArr2 = Object.fromEntries(Object.entries(obj));
  nwArr.a = "bar";
  nwArr2.a = "foobar"
  console.log(`obj.a: ${obj.a}, nwArr.a: ${nwArr.a}, nwArr2.a: ${nwArr2.a}`);

Answer 8

const address = {
        street: "bew1111",
        city: "err111",
        country: "ind11"
    };
    const address2 = {
        street: "bewscxsd",
        city: "errdc",
        country: "indcdsc"
    };

we have two objects here and I am going to use 2 methods for assign both objects into Array

1. Object.entries()

2. Object.keys()

1st one starts here-----

var firstar = Object.entries(address);

here I assigned address into firstar and when you will run this you will get output like this

(3) [Array(2), Array(2), Array(2)]

2nd one starts here

var secstar = Object.keys(address2);

here I assigned address2 into secstar and when you will run this you will get output like this

 (3) ["street", "city", "country"]