( for... in ) と ( for... of ) ステートメントの違いは何ですか? 質問する

ループとは何か（キーを反復処理する）は知っていますが、値を繰り返し処理するというのは初めてfor... in聞きました。for... of

for... ofループについて混乱しています。

var arr = [3, 5, 7];
arr.foo = "hello";
    
for (var i in arr) {
  console.log(i); // logs "0", "1", "2", "foo"
}
    
for (var i of arr) {
  console.log(i); // logs "3", "5", "7"
  // it doesn't log "3", "5", "7", "hello"
}

がプロパティ値を反復処理することは理解しています。では、の代わりにfor... ofがログに記録されないのはなぜですか?"3", "5", "7", "hello""3", "5", "7"

for... in各キー ( ) を反復処理し"0", "1", "2", "foo"、キーも反復処理する loop とは異なりfoo、 はプロパティの値、つまり を反復処理for... of しません。なぜこのようなことになるのでしょうか。foo"hello"

ここでコンソールfor... ofループが発生します。ログに記録されるはずです"3", "5", "7","hello"が、ログに記録されます"3", "5", "7"。なぜでしょうか。

例のリンク