JavaScript- Convert an Object to JS Array

Objects in JavaScript are the most important data type and form the building blocks for modern JavaScript. These objects are quite different from JavaScript’s primitive data types (Number, String, Boolean, null, undefined, and symbol).

Methods to convert the Objects to JavaScript Array:

1. Using Object.keys() and JavaScript map() Method

By using Object.keys(), we are extracting keys from the Object then this key is passed to the map() function which maps the key and corresponding value as an array.

let obj = { "1": 5, "2": 7, "3": 0, "4": 0, "5": 0 };

let result = Object.keys(obj).map(function (key) {
    return [Number(key), obj[key]];
});
console.log(result)

[ [ 1, 5 ], [ 2, 7 ], [ 3, 0 ], [ 4, 0 ], [ 5, 0 ] ]

2. Using JavaScript Object.entries() Method

The Object.entries() method is used to return an array consisting of enumerable property [key, value] pairs of the object which are passed as the parameter. The ordering of the properties is the same as that given by looping over the property values of the object manually. 

let obj = { "1": 5, "2": 7, "3": 0, "4": 0, "5": 0 };

let result = Object.entries(obj);
console.log(result)

[ [ '1', 5 ], [ '2', 7 ], [ '3', 0 ], [ '4', 0 ], [ '5', 0 ] ]

3. Using for...in loop

In JavaScript, a for...in loop iterates over an object's keys. By checking if each key is a direct property using hasOwnProperty, key-value pairs are pushed into an array. This approach efficiently converts an object to an array of key-value pairs.

let obj = { "1": 5, "2": 7, "3": 0, "4": 0, "5": 0 };
let result = [];

for (let key in obj) {
    if (obj.hasOwnProperty(key)) {
        result.push([Number(key), obj[key]]);
    }
}
console.log(result)

[ [ 1, 5 ], [ 2, 7 ], [ 3, 0 ], [ 4, 0 ], [ 5, 0 ] ]

4. Using Object.getOwnPropertyNames() Method

The Object.getOwnPropertyNames() method retrieves all own property names of an object. By combining it with Array.prototype.map(), we can create an array of key-value pairs by iterating over the property names and accessing their corresponding values from the object.

const obj = { a: 1, b: 2, c: 3 };
const keys = Object.getOwnPropertyNames(obj);
const arr = keys.map(key => [key, obj[key]]);
console.log(arr);

[ [ 'a', 1 ], [ 'b', 2 ], [ 'c', 3 ] ]

5. Using Object.values() and Object.keys()

In this approach, we use Object.values() to get an array of values from the object and combine it with Object.keys() to create an array of key-value pairs.

const obj = { a: 1, b: 2, c: 3 };
const keys = Object.keys(obj);
const values = Object.values(obj);
const res = keys.map((key, index) => [key, values[index]]);
console.log(res); 

[ [ 'a', 1 ], [ 'b', 2 ], [ 'c', 3 ] ]