Iterate Keys
for...in iterates over enumerable keys of an object.
It is best suited for objects, not arrays.
JavaScript Tutorial
JavaScript for...in Loop
The for...in loop iterates over the keys of an object.
It is useful for inspecting properties or building key-based logic.
Why We Need It
Object iteration is common for configuration, settings, and dynamic data shapes.
Knowing how for...in behaves helps you avoid inherited keys and ordering surprises.
Syntax
for (const key in object) { ... }Basic Example
1. Basic for...in
const user = { id: 1, name: "Ava" };
for (const key in user) {
console.log(key, user[key]);
}Iterate keys and access values by bracket notation.
Real World Example
2. Filter own properties
const obj = Object.create({ inherited: true });
obj.own = "yes";
for (const key in obj) {
if (Object.hasOwn(obj, key)) {
console.log(key);
}
}Filter out inherited keys with Object.hasOwn.
Multiple Use Cases
Own vs Inherited
for...in also iterates over inherited properties unless filtered.
Use Object.hasOwn() or Object.prototype.hasOwnProperty.call() to filter.
Order Is Not Guaranteed
Do not rely on key order when using for...in.
If you need order, use Object.keys and sort explicitly.
More Examples
3. Object.keys alternative
const settings = { theme: "dark", compact: true };
Object.keys(settings).forEach((key) => {
console.log(key, settings[key]);
});Use Object.keys for more explicit control.
4. Avoid with arrays
const list = ["a", "b"];
for (const key in list) {
console.log(key); // indexes as strings
}Use for...of for array values instead.
Comparison
Without
const obj = { a: 1, b: 2 };
for (let i = 0; i < Object.keys(obj).length; i++) {
const key = Object.keys(obj)[i];
console.log(key, obj[key]);
}With
const obj = { a: 1, b: 2 };
for (const key in obj) {
console.log(key, obj[key]);
}Common Mistakes and Fixes
Using for...in on arrays
Use for...of or array methods for values.
Forgetting inherited keys
Filter with Object.hasOwn when needed.
Assuming key order
Do not rely on key order unless you sort explicitly.
Interview Questions
What does for...in return?
It iterates over enumerable keys of an object.
How do you avoid inherited properties?
Filter with Object.hasOwn.
Why prefer for...of for arrays?
for...of gives values directly and avoids key surprises.
Practice Problem
Practice: Iterate over a settings object and log key=value pairs.
const settings = { theme: "light", layout: "grid" };
// TODO: log each key and value
One Possible Solution
const settings = { theme: "light", layout: "grid" };
for (const key in settings) {
console.log(key, settings[key]);
}Frequently Asked Questions
What does for...in iterate?
Enumerable keys of an object, including inherited ones unless filtered.
Why not use for...in on arrays?
It iterates keys as strings and can include unexpected properties.
How do I filter own properties?
Use Object.hasOwn(obj, key).
Try It Yourself
Try adding more keys and see how for...in iterates them.