Convert an Object's Values or Keys to an Array in JavaScript

# Convert an Object's Values to an array in JavaScript

Use the Object.values() method to get an object's values as an array, e.g. Object.values(obj);.

The method returns an array containing the object's property values in the same order as provided by a for ... in loop.

Copied!
const obj = {id: 1, country: 'Chile', city: 'Santiago'};

const values = Object.values(obj);

// 👇️ [1, 'Chile', 'Santiago']
console.log(values);

We used the Object.values() method to get the object's values as an array.

# Convert an Object's Keys to an array in JavaScript

You can use the Object.keys() method to convert an object's keys to an array.

Copied!
const obj = {id: 1, country: 'Chile', city: 'Santiago'};

const keys = Object.keys(obj);

// 👇️ [ 'id', 'country', 'city' ]
console.log(keys);

The Object.keys() method returns an array of the object's keys.

# Convert an Object's Entries to an array in JavaScript

If you need to convert an object's entries to an array, use the Object.entries() method.

Copied!
const obj = {id: 1, country: 'Chile', city: 'Santiago'};

const entries = Object.entries(obj);

// 👇️ [ [ 'id', 1 ], [ 'country', 'Chile' ], [ 'city', 'Santiago' ] ]
console.log(entries);

The Object.entries() method returns an array of the given object's key-value pairs.

If you need to convert the array of key-value pairs back to an object, use the Object.fromEntries() method.

Copied!
const obj = {id: 1, country: 'Chile', city: 'Santiago'};

const entries = Object.entries(obj);

// 👇️ [ [ 'id', 1 ], [ 'country', 'Chile' ], [ 'city', 'Santiago' ] ]
console.log(entries);

const objAgain = Object.fromEntries(entries);
console.log(objAgain); // 👉️ { id: 1, country: 'Chile', city: 'Santiago' }

The Object.fromEntries() method converts an array of key-value pairs to an object.

You can also use the Object.keys() method to get an object's values as an array.

# Converting string keys to numeric

If you need to convert an object's entries to an array and convert string keys to numeric keys, use the Array.map() method.

Copied!
const obj = {'0': 9, '1': 8, '2': 7};

const entries = Object.entries(obj).map(([key, value]) => [
  Number(key),
  value,
]);

// 👇️ [ [ 0, 9 ], [ 1, 8 ], [ 2, 7 ] ]
console.log(entries);

We used the Object.entries() method to get an array of the object's entries.

The next step is to use the Array.map() method to iterate over the array and convert each key to a number.

# Get an Object's Values as an Array using Object.keys()

This is a three-step process:

1. Use the Object.keys() method to get an array of the object's keys.
2. Use the Array.map() method to iterate over the array.
3. Access the object at each key and return each value.

Copied!
const obj = {id: 1, country: 'Chile', city: 'Santiago'};

// 👇️ ['id', 'country', 'city']
const keys = Object.keys(obj);
console.log(keys);

const values = keys.map(key => {
  return obj[key];
});

// 👇️ [1, 'Chile', 'Santiago']
console.log(values);

We used the Object.keys() method to get an array containing the object's keys.

Copied!
const obj = {id: 1, country: 'Chile', city: 'Santiago'};

// 👇️ ['id', 'country', 'city']
const keys = Object.keys(obj);
console.log(keys);

The next step is to iterate over the array of keys using Array.map() and return the value of each key.

The function we passed to the Array.map() method gets invoked for each key in the keys array.

This approach is a bit more indirect and verbose and should only be used if you have to support very old browsers like Internet Explorer.

# Get an object's entries as an array using Object.keys()

The same approach can be used if you need to get an object's entries as an array.

Copied!
const obj = {id: 1, country: 'Chile', city: 'Santiago'};

const keys = Object.keys(obj);

const values = keys.map(key => {
  return [key, obj[key]];
});

// 👇️ [ [ 'id', 1 ], [ 'country', 'Chile' ], [ 'city', 'Santiago' ] ]
console.log(values);

We used the Array.map() method to iterate over an array of the object's keys.

On each iteration, we return an array containing the current key and value.

# Get an Object's Values as an Array using a for...in loop

This is a three-step process:

1. Use a for...in loop to iterate over the object.
2. Use the current key to get the current value.
3. Push each value into an array.

Copied!
const obj = {id: 1, country: 'Chile', city: 'Santiago'};

const valuesArray = [];

for (const key in obj) {
  valuesArray.push(obj[key]);
}

// 👇️ [ 1, 'Chile', 'Santiago' ]
console.log(valuesArray);

We used the for...in loop to iterate over the object.

On each iteration, we use the current key to get the value and push the value into a new array.

# Additional Resources

You can learn more about the related topics by checking out the following tutorials:

• Get an Object's Key by its Value using JavaScript
• Get an Object's Value using a Variable Key in JavaScript
• Get an Object's Key or Value by Index in JavaScript