For each...in / For...in / For...of 的解释和例子

for each...in 语句在对象属性的所有值上迭代指定的变量。对于每个不同的属性，执行一个指定的语句。

语法：

for each (variable in object) {
  statement
}

参数：

variable

用来遍历属性值的变量,前面的var关键字是可选的.该变量是函数的局部变量而不是语句块的局部变量.

object

该对象的属性值会被遍历.

statement

遍历属性值时执行的语句. 如果想要执行多条语句, 请用({ ... }) 将多条语句括住.

 

一些对象的内置属性是无法被遍历到的,包括所有的内置方法,例如String对象的indexOf方法.不过,大部分的用户自定义属性都是可遍历的.

警告:永远不要使用for each...in语句遍历数组,仅用来遍历常规对象。

例子

var sum = 0;
var obj = {prop1: 5, prop2: 13, prop3: 8};

for each (var item in obj) {
  sum += item;
}

print(sum);

就会输出"26",也就是5+13+8的值

例子摘自https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/for_each...in

for...in 以任意顺序遍历一个对象的可枚举属性。对于每个不同的属性，语句都会被执行。

语法：

for (variable in object)
 { ...
}

参数：

variable

在每次迭代时,将不同的属性名分配给变量。

object

      被迭代其枚举属性的对象。

for...in不应该被用来迭代一个下标顺序很重要的 array。因为for...in 并不能够保证返回的是按一定顺序的索引，但是它会返回所有可枚举属性，包括非整数名称的和继承的。

例子

          var obj = {a:1, b:2, c:3}

          for (var prop in obj) { console.log("obj." + prop + " = " + obj[prop]);

               }

// Output:
// "obj.a = 1"
// "obj.b = 2"
// "obj.c = 3"

例子摘自https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Statements/for...in#Description

 

for...of 语句创建一个循环遍历可迭代对象(包括内置的字符串、数组，例如类数组参数或NodeList对象、TypedArray、Map和Set以及用户定义的迭代)，调用一个定制的迭代钩子，并用语句执行对象的每个不同属性的值。

 

语法：

 

for (variable of iterable) {
  statement
}

ariable：

在每次迭代中，将不同属性的值赋给变量。

iterable：

对象，其可迭代属性被迭代。

例子：

迭代数组

let iterable = [10, 20, 30];

for (let value of iterable) {
  value += 1;
  console.log(value);
}
// 11
// 21
// 31

如果不重新分配块内的变量，可以使用const而不是let。

let iterable = [10, 20, 30];

for (const value of iterable) {
  console.log(value);
}
// 10
// 20
// 30

遍历字符串：

let iterable = 'boo';

for (let value of iterable) {
  console.log(value);
}
// "b"
// "o"
// "o"

迭代TypedArray：

let iterable = new Uint8Array([0x00, 0xff]);

for (let value of iterable) {
  console.log(value);
}
// 0
// 255
例子摘自https://devdocs.io/javascript/statements/for...of