How to iterate object values with Object.values()?

👨‍💻 Frontend Developer 🟠 May come up 🎚️ Easy
#JavaScript #Objects #JS Basics

Brief Answer

Object.values() returns an array of values of all enumerable properties of an object. Unlike for…in, it doesn’t iterate inherited properties and returns values directly, not keys.

const user = { name: 'John', age: 25 };
const values = Object.values(user);
console.log(values); // ['John', 25]

Full Answer

Object.values() is a method to get all property values of an object. It’s simple and convenient when you need to work only with values, not keys.

How Object.values() Works

Returns array of property values:

const user = { name: 'John', age: 25 };
const values = Object.values(user);
console.log(values); // ['John', 25]

What Object.values() Returns

Array of Values

const obj = { a: 1, b: 2, c: 3 };
console.log(Object.values(obj)); // [1, 2, 3]

Only Own Properties

const obj = { name: 'John' };
// Doesn't include toString, hasOwnProperty and other inherited methods

Simple Examples

Getting All Values

const user = { 
  name: 'John', 
  age: 25, 
  city: 'Moscow' 
};
 
const values = Object.values(user);
console.log(values); // ['John', 25, 'Moscow']

Working with Values Array

const scores = { math: 5, physics: 4, chemistry: 5 };
 
// Sum of all scores
const total = Object.values(scores).reduce((sum, score) => sum + score, 0);
console.log(total); // 14

Important Features

1. Values Order

// Order is same as in for...in
const obj = { 3: 'three', 1: 'one', 2: 'two', a: 'letter' };
console.log(Object.values(obj)); // ['one', 'two', 'three', 'letter']

2. Only Enumerable Properties

const obj = { name: 'John' };
// Hide property
Object.defineProperty(obj, 'hidden', {
  value: 'secret',
  enumerable: false
});
 
console.log(Object.values(obj)); // ['John'] - hidden not visible

When to Use Object.values()

Instead of for…in When Need Only Values

const user = { name: 'John', age: 25 };
 
// ❌ Complex way
const values1 = [];
for (let key in user) {
  if (user.hasOwnProperty(key)) {
    values1.push(user[key]);
  }
}
 
// ✅ Simple way
const values2 = Object.values(user);

For Working with Values Array

const prices = { apple: 100, banana: 50, orange: 80 };
 
// Find maximum price
const maxPrice = Math.max(...Object.values(prices));
console.log(maxPrice); // 100

Common Mistakes

1. Expecting Keys

// ❌ Thinking we get keys
const obj = { a: 1, b: 2 };
const result = Object.values(obj);
console.log(result); // [1, 2] - values, not keys!
 
// ✅ For keys use Object.keys()
const keys = Object.keys(obj);
console.log(keys); // ['a', 'b']

2. Working with Non-objects

// ❌ Trying to use with primitives
Object.values(42); // Error!
 
// ✅ Only with objects
Object.values({ value: 42 }); // [42]

Simple Rules

  1. Object.values() — for getting property values
  2. Array — always returns array
  3. Own — only own properties
  4. Order — preserved as in for…in
  5. Simplicity — simpler than for…in for getting values

Object.values() is convenient when you need to work only with object property values. It’s simpler than for…in and doesn’t require inheritance checks.


Want more articles to prepare for interviews? Subscribe to EasyAdvice, bookmark the site and improve yourself every day 💪