JavaScript—for...in 语句、for...of 语句

for...in 语句EDIT

这个 for...in 语句循环一个指定的变量来循环一个对象所有可枚举的属性。JavaScript 会为每一个不同的属性执行指定的语句。

for (variable in object) {
  statements
}

例子

下面的函数通过它的参数得到一个对象和这个对象的名字。然后循环这个对象的所有属性并且返回一个列出属性名和该属性值的字符串。

function dump_props(obj, obj_name) {
  var result = "";
  for (var i in obj) {
    result += obj_name + "." + i + " = " + obj[i] + "<br>";
  }
  result += "<hr>";
  return result;
}

对于一个对象拥有 make 和 model 属性的 car 对象来说，执行结果是：

car.make = Ford
car.model = Mustang

数组

虽然用for...in来迭代Array元素很诱人，但是它返回的除了数字索引外还有可能是你自定义的属性名字。因此还是用带有数字索引的传统的for 循环来迭代一个数组比较好，因为如果你想改变数组对象，比如添加属性或者方法，for...in 语句迭代的是 自定义的属性而不是数组的元素。

for...of statementEDIT

该新特性属于 ECMAScript 2015（ES6）规范，在使用时请注意浏览器兼容性。

for...of语句在可迭代的对象上创建了一个循环(包括Array, Map, Set, 参数对象（ arguments） 等等)，对值的每一个独特的属性调用一个将被执行的自定义的和语句挂钩的迭代。

for (variable of object) {
  statement
}

下面的这个例子展示了 for...of 和 for...in 两种循环语句之间的区别。与 for...in 循环遍历的结果是数组元素的下标不同的是， for...of 遍历的结果是元素的值：

let arr = [3, 5, 7];
arr.foo = "hello";

for (let i in arr) {
   console.log(i); // logs "0", "1", "2", "foo"
}

for (let i of arr) {
   console.log(i); // logs "3", "5", "7" // 注意这里没有 hello
}