difference between " for in " and " for of "

Hi Peter!

The biggest difference between for..in and for..of is all to do with how your code is able to/needs to interact with data!

The for..in loop deals with the organizational part of the data rather than the specific values. This could mean returning the keys for an array or the properties of an object. If we were to run the following code both with an array and an object:

// ARRAY
var arr = [8, 54, 1];

for (var i in arr) {
  console.log(i);
}

//OBJECT
var example = { name: "Bella"}

for(var i in example) {
  console.log(i)
}

the console would log 0, 1, 2 from the array and name from the object because it's referring to the keys/properties IN the data structure.

The for..of loop deals with the actual values of iterable data (which is why it can't be used with objects). If we ran the following code using only the array example from above:

var arr = [8, 54, 1];

for (var i of arr) {
  console.log(i); 
}

The console would log 8, 54, 1 because it is referring to the value OF the data itself.

To sum up:

1. for..in
   • works with objects & arrays (but is more suited to objects)
   • deals with data structure over data value
2. for..of
   • works with arrays only
   • deals with data value over data structure

Hope this helps!