How to Iterate Through Object Properties in JavaScript

By the end of this page, you will understand how the JavaScript for...in loop works, why the loop variable can have any name, and how it gets assigned each enumerable property name of an object one at a time. You will also learn safer modern alternatives such as Object.keys(), Object.values(), and Object.entries().

In JavaScript, for...in is a special loop used to iterate over the property names of an object.

When you write:

for (var propt in obj) {
  console.log(propt);
}

JavaScript reads this as:

• Look at the object obj
• Find its enumerable property names
• For each property name, assign that name to the variable propt
• Run the loop body

The important point is that propt is just a variable name you chose. It is not built in. You could call it key, property, x, or anything valid:

for (var key in obj) {
  console.log(key);
}

This works the same way.

In your example, the loop visits these top-level properties:

• name

Think of an object like a labeled storage cabinet:

• name is one drawer label
• age is another drawer label
• clothing is another drawer label

A for...in loop is like saying:

"Go through each drawer label in this cabinet, one by one, and write the current label on a sticky note."

That sticky note is your loop variable.

So propt is not special. It is just the sticky note name you chose. JavaScript keeps updating it with the next property label during the loop.

Basic syntax

for (var key in object) {
  // use key
}

• key is a normal variable
• object is the object being inspected
• On each loop, key contains the next property name as a string

Example: logging keys and values

var user = {
  name: "Simon",
  age: 20,
  active: true
};

for (var key in user) {
  console.log(key);         // property name
  console.log(user[key]);   // property value
}

Possible output:

name
Simon
age
20
active
true

Why bracket notation is used

This works:

Consider this code:

var obj = {
  name: "Simon",
  age: 20,
  clothing: {
    style: "simple",
    hipster: false
  }
};

for (var propt in obj) {
  console.log(propt + ': ' + obj[propt]);
}

Step by step:

1. JavaScript creates the object obj with three properties:

   • name
   • age
   • clothing

2. The loop starts:

   for (var propt in obj)
   

   JavaScript prepares to iterate through the enumerable property names of obj.

3. First iteration:

   • propt is assigned

for...in and object key iteration are useful when property names are not known in advance.

Common situations

• Form validation: loop through submitted fields and check for empty values
• Configuration objects: inspect settings and apply defaults
• API response formatting: transform object fields into display text
• Debugging: log all properties in an object
• Data cleanup: remove or normalize invalid values

Example: validating form data

var formData = {
  username: "simon",
  email: "",
  password: "secret123"
};

for (var key in formData) {
  if (formData[key] === "") {
    console.log(key + " is required");
  }
}

Example: printing config values

var config = {
  theme: "dark",
  notifications: true,
  language: "en"
};

for (var key  config) {
  .(key +  + config[key]);
}

In real projects, developers often iterate over object properties to process dynamic data. However, they usually do it carefully.

Common patterns

1. Filtering own properties

Because for...in can include inherited enumerable properties, developers often guard against that:

for (var key in obj) {
  if (Object.hasOwn(obj, key)) {
    console.log(key, obj[key]);
  }
}

2. Using Object.keys() for safer iteration

Object.keys(obj).forEach(function (key) {
  console.log(key, obj[key]);
});

This only returns the object's own enumerable property names.

3. Using Object.entries() when both key and value are needed

Object.entries(obj).forEach( () {
  .(key, value);
});

1. Thinking the loop variable is built in

Wrong idea:

• propt has special meaning

Reality:

• It is just a variable name you chose

These are all valid:

for (var propt in obj) {}
for (var key in obj) {}
for (var propertyName in obj) {}

2. Using dot notation with the variable name

Broken code:

for (var key in obj) {
  console.log(obj.key);
}

Why it is wrong:

• obj.key means a property literally called key
• It does not mean "use the value inside the variable key"

Correct code:

 ( key  obj) {
  .(obj[key]);
}

for...in vs other ways to iterate objects

Example comparison

Quick reference

for...in syntax

for (var key in obj) {
  console.log(key, obj[key]);
}

Key facts

• The loop variable can have any valid name
• It stores the current property name as a string
• Use bracket notation: obj[key]
• for...in iterates enumerable properties
• It may include inherited properties

Safer pattern

for (var key in obj) {
  if (Object.hasOwn(obj, key)) {
    console.log(key, obj[key]);
  }
}

Modern alternatives

Object.keys(obj)
Object.values(obj)
Object.entries(obj)

Common pitfall

Why can I name the loop variable anything in for...in?

Because it is just a normal variable. JavaScript assigns each property name to that variable during the loop.

Does for...in return values or keys?

It returns property names, also called keys. You then use obj[key] to get the value.

Why do I need obj[key] instead of obj.key?

obj[key] uses the variable's current value. obj.key looks for a property literally named key.

Does for...in work on nested objects automatically?

No. It only iterates the current object's top-level enumerable properties.

Is for...in safe for all objects?

It works, but it can include inherited properties. Use Object.hasOwn() or prefer Object.keys() when you only want the object's own keys.

Should I use for...in for arrays?

Usually no. Arrays are better handled with for, , or .

• Objects in JavaScript — Objects store data as key-value pairs, which is the foundation of property iteration.
• Bracket notation — You need bracket notation to access a property using a variable.
• Dot notation — Useful to compare with bracket notation and understand why obj[key] works.
• Object.keys() — A common modern alternative for iterating over an object's own keys.
• Object.entries() — Helpful when you need both property names and values together.
• for...of loop — Often compared with for...in, especially when learning iteration.
• Arrays in JavaScript — Important because beginners often confuse object iteration with array iteration.
• Prototype inheritance — Explains why for...in can include inherited properties.