How to iterate over object properties using for...in loop in JavaScript

The simplest way to iterate over object keys and values is using the for...in loop. This method works in all modern and old browsers, including Internet Explorer 6 and higher.

Here is an example that uses the for...in loop to iterate over an object:

const user = {
  name: 'John Doe',
  email: 'john.doe@example.com',
  age: 25,
  dob: '08/02/1989',
  active: true
}

// iterate over the user object
for (const key in user) {
  console.log(`${key}: ${user[key]}`)
}

// name: John Doe
// email: john.doe@example.com
// age: 25
// dob: 08/02/1989
// active: true

The only problem with for...in loop is that it iterates through the properties in the prototype chain.

Since the objects in JavaScript can inherit properties from their prototypes, the for...in statement will loop through those properties as well.

To exclude prototype properties while looping over an object, you need to explicitly check if the property belongs to the object by using the hasOwnProperty() method:

for (const key in user) {
  if (user.hasOwnProperty(key)) {
    console.log(`${key}: ${user[key]}`)
  }
}

✌️ Like this article? Follow me on Twitter and LinkedIn. You can also subscribe to RSS Feed.