The for...in
loop
We use for...in
when we want to use the keys of an Object.
const myObject = {
keyOne: 'valueOne',
keyTwo: 'valueTwo',
keyThree: 'valueThree'
}
for (const propertyKey in myObject) {
console.log(propertyKey)
}
// Will result in:
> 'keyOne'
> 'keyTwo'
> 'keyThree'
As we can see in the example propertyKey
will be the key of the object.
You should know
💡for...in
will ignore any Symbols in your Object
If we want to access the value we can still do it like this
for (const propertyKey in myObject) {
console.log(myObject[propertyKey])
}
But instead of doing this we could use a for...of
loop.
The for...of
loop
The for...of
loop will iterate over the values of the Iterable Object.
Here's an example with an Array
const myIterableObject = [
'valueOne', 'valueTwo', 'valueThree'
]
for (const myValue of myIterableObject) {
console.log(myValue)
}
// Will result in
> 'valueOne'
> 'valueTwo'
> 'valueThree'
This is a good alternative to the forEach
method
This was a quick introduction to these two syntaxes of the for loop in Javascript. I recommend you play around with them. These two are really useful to know when you want to write short for loops.
Top comments (1)
Nice article, short and precise