For In and For Of in Javascript

Hey fellow developers

Let's learn the differences between the loops For... In and For... Of in Javascript in less than a minute!

If you prefer to watch the video version, it's right here :

1. The For... Of loop.

The For... Of loop is used to iterate through iterable elements, for example arrays, strings, nodelists, etc. It has the following syntax:

const array = [1, 2, 3];for(const item of array){    console.log(item);}// in the console :// 1// 2// 3

It will basicaly create a new constant for each element.

If you use a string, it'll be exactly the same:

const str = "123";for(const item of str){    console.log(item);}// in the console :// "1"// "2"// "3"

2. The For... In loop.

The For... In loop is used to iterate through an object.

const tiger = {    paws: 4,    weight: 300,    height 100}for(const prop in tiger){    console.log(prop);    console.log(tiger[prop]);}// in the console :// "paws" 4// "weight" 300// "height" 100

Here you can access the property name with "prop" and/or the property value with tiger[prop].

You now know the differences between these two loops!

Come and take a look at my Youtube channel: https://www.youtube.com/c/Learntocreate/videos

See you soon!

Enzo.