JavaScript中的for语句和for语句之间有什么区别？

我知道什么是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 is does not log "3", "5", "7", "hello" }

我得到的是，for... of遍历属性值。那么，为什么它不记录（返回）"3", "5", "7", "hello"而不是"3", "5", "7"？但for... in循环会遍历每个键（"0", "1", "2", "foo"）。在这里，for... in循环还会遍历foo键。但是for... of不会迭代foo财产的价值，即"hello"。为什么会这样呢？

总而言之：

在这里，我控制台for... of循环。它应该记录，"3", "5", "7","hello"但是在这里记录"3", "5", "7"。为什么呢