为…In语句以任意顺序遍历对象的可枚举属性。 可枚举属性是那些内部[[Enumerable]]标志被设置为true的属性，因此如果原型链中有任何可枚举属性，for…In循环也会迭代这些。

为…语句对iterable对象定义的要迭代的数据进行迭代。

例子:

Object.prototype.objCustom = function() {}; 
Array.prototype.arrCustom = function() {};

let iterable = [3, 5, 7];

for (let i in iterable) {
  console.log(i); // logs: 0, 1, 2, "arrCustom", "objCustom"
}

for (let i in iterable) {
  if (iterable.hasOwnProperty(i)) {
    console.log(i); // logs: 0, 1, 2,
  }
}

for (let i of iterable) {
  console.log(i); // logs: 3, 5, 7
}

像前面一样，你可以跳过添加hasOwnProperty在…的循环。

A看到了很多好的答案，但我决定把我的5美分只是为了有一个好的例子:

For in循环

遍历所有可枚举的道具

let nodes = document.documentElement.childNodes; 对于(var键在节点中){ Console.log (key); ｝

For循环

遍历所有可迭代值

let nodes = document.documentElement.childNodes; 对于(var节点中的节点){ console.log(node.toString()); ｝

简单的回答:为了……在键上循环，而for…对值的循环。

for (let x in ['a', 'b', 'c', 'd'] {
    console.log(x); 
}

// Output
0
1
2
3


for (let x of ['a', 'b', 'c', 'd'] {
    console.log(x); 
}

// Output
a
b
c
d

这里有一个有用的助记符来记住for…in Loop和for…的循环。

索引的对象

为…in Loop =>迭代数组中的索引。

为…of Loop =>遍历对象的对象。

当我第一次开始学习for in和of循环时，我也对我的输出感到困惑，但通过一些研究和理解，你可以像下面这样思考单个循环: 的

为…在循环中返回单个属性的索引，对属性的值没有影响，它循环并返回关于属性的信息，而不是关于属性的值。 如

Let profile = { 名字叫拿弗他利。 年龄:24岁 favCar:“野马”， 最喜欢的饮料:百利酒 ｝

上面的代码只是创建了一个名为profile的对象，我们将在两个示例中使用它，因此，当您在示例中看到profile对象时，不要感到困惑，只需知道它已被创建。

现在让我们用for…在下面的循环中

for(let myIndex in profile){
    console.log(`The index of my object property is ${myIndex}`)
}
 // Outputs : 
        The index of my object property is 0
        The index of my object property is 1
        The index of my object property is 2
        The index of my object property is 3

现在输出的原因是，我们的配置文件对象中有四(4)个属性，我们都知道索引从0开始…N，我们得到了属性的下标0,1,2,3因为我们使用的是for. in循环。

for...of loop* can return either the property, value or both, Let's take a look at how. In javaScript, we can't loop through objects normally as we would on arrays, so, there are a few elements we can use to access either of our choices from an object. Object.keys(object-name-goes-here) >>> Returns the keys or properties of an object. Object.values(object-name-goes-here) >>> Returns the values of an object. Object.entries(object-name-goes-here) >>> Returns both the keys and values of an object.

下面是它们的用法示例，请注意Object.entries():

Step One: Convert the object to get either its key, value, or both.
Step Two: loop through.


// Getting the keys/property

   Step One: let myKeys = ***Object.keys(profile)***
   Step Two: for(let keys of myKeys){
             console.log(`The key of my object property is ${keys}`)
           }

// Getting the values of the property

    Step One: let myValues = ***Object.values(profile)***
    Step Two : for(let values of myValues){
                 console.log(`The value of my object property is ${values}`)
               }

当使用object .entries()时，需要调用对象上的两个条目，即键和值。您可以通过条目中的任意一个调用两者。下面的例子。

Step One: Convert the object to entries, using ***Object.entries(object-name)***
Step Two: **Destructure** the ***entries object which carries the keys and values*** 
like so **[keys, values]**, by so doing, you have access to either or both content.


    // Getting the keys/property

       Step One: let myKeysEntry = ***Object.entries(profile)***
       Step Two: for(let [keys, values] of myKeysEntry){
                 console.log(`The key of my object property is ${keys}`)
               }

    // Getting the values of the property

        Step One: let myValuesEntry = ***Object.entries(profile)***
        Step Two : for(let [keys, values] of myValuesEntry){
                     console.log(`The value of my object property is ${values}`)
                   }

    // Getting both keys and values

        Step One: let myBothEntry = ***Object.entries(profile)***
        Step Two : for(let [keys, values] of myBothEntry){
                     console.log(`The keys of my object is ${keys} and its value 
is ${values}`)
                   }

对不清楚的部分提出意见。

为…Of循环只对可迭代对象有效。在JavaScript中，可迭代对象是可以循环的对象。

String、Array、TypedArray、Map和Set都是内置的可迭代对象，因为它们的每个原型对象都实现了@@iterator方法。因此,对于…Of循环作用于上述的对象类型。

Object在JavaScript中默认是不可迭代的。因此,对于…Of循环对对象无效。

简单地说，对于……Of适用于字符串和数组，但不适用于对象。

为…In适用于那些可枚举标志设置为true的属性。

通过简单赋值或属性初始化器创建的属性的可枚举标志默认为true。 通过Object.defineProperty创建的属性的可枚举标志默认为false。

这里有一个更详细的例子:https://dev.to/swastikyadav/difference-between-forof-and-forin-loop-in-javascript-j2o