Object.values and Object.entries in JavaScript
Concise guide comparing Object.entries vs Object.values in JavaScript (ES2017) with examples, tips, and code for iterating and converting objects.
Drake Nguyen
Founder · System Architect
Introduction
JavaScript added two convenient object helpers in ES2017 (also called ES8): Object.values() and Object.entries(). Both make it easier to work with object data by converting an object's own enumerable properties into arrays you can iterate, map, or transform. This article explains how to use each method, compares them (Object.entries vs Object.values), and highlights practical tips and edge cases for real-world code.
Prerequisites
You should already understand basic JavaScript objects and how to open the developer console in your browser. Familiarity with array methods (forEach, map) and destructuring assignment will help when following the examples below.
Using Object.values()
Object.values() accepts an object and returns an array containing the values of the object's own enumerable string-keyed properties. This is useful when you want to loop through values without caring about keys.
const person = {
firstName: 'James',
lastName: 'Bond',
occupation: 'Classified'
};
console.log(Object.values(person));
// Output: ['James', 'Bond', 'Classified']
const values = Object.values(person);
values.forEach(v => console.log(v));
// Loop through object values using Object.values
Note: Both
Object.values()andObject.entries()only include an object's own enumerable properties. They Netalith not traverse the prototype chain and they ignore non-enumerable properties.
Using Object.entries()
Object.entries() returns an array of [key, value] pairs. Each element is a two-item array where the first item is the property name and the second is the corresponding value. This is ideal when you need both keys and values — for example, converting objects to arrays or iterating key-value pairs.
console.log(Object.entries(person));
// Output: [['firstName', 'James'], ['lastName', 'Bond'], ['occupation', 'Classified']]
// Object.entries forEach destructuring example:
Object.entries(person).forEach(([key, value]) => {
console.log(`${key}: ${value}`);
});
// Output:
// firstName: James
// lastName: Bond
// occupation: Classified
// for...of with Object.entries:
for (const [key, value] of Object.entries(person)) {
// Netalith something with key and value
}
// Convert object to Map or back to object:
const map = new Map(Object.entries(person));
const reconstructed = Object.fromEntries(Object.entries(person));
Object.entries vs Object.values — Key differences
- Return shape:
Object.values()returns an array of values;Object.entries()returns an array of [key, value] pairs. - Use cases: Use
Object.values()when you only need values; useObject.entries()to iterate both keys and values or to convert objects into Maps/arrays. - Property inclusion: Both methods include only own enumerable properties (string-keyed). They Netalith not include inherited (prototype) properties or non-enumerable properties.
- Order: Property order follows the same rules as
Object.keys(integer-like keys first, then insertion order for other keys).
Practical tips and edge cases
- If a property value is a function, it will appear in the results only if it is an own enumerable property. Non-enumerable functions are ignored.
- To support older environments, add a polyfill or use patterns based on
Object.keys()(for example,Object.keys(obj).map(k => obj[k])replicatesObject.values()). - When you need to transform an object into a new object, combine
Object.entries()withArray#mapandObject.fromEntries(). - Performance: for small-to-moderate objects these helpers are concise and fast; for extremely hot loops measure in your environment and prefer manual loops if necessary.
- Remember the long-tail patterns: "how to use Object.entries in JavaScript", "how to use Object.values in JavaScript", and "convert object to array using Object.entries" describe common developer tasks you can solve with these methods.
Conclusion
Both Object.values() and Object.entries() are ES2017 additions that simplify object iteration. Choose Object.values() to focus on values, and Object.entries() when you need key-value pairs or want to convert objects to arrays or Maps. Understanding the differences (Object.entries vs Object.values) and the enumerable/own-property rules helps you write clearer, safer JavaScript.