JS 循环遍历总结

for

• 介绍

for 语句用于创建一个循环，它包含了三个可选的表达式，这三个表达式被包围在圆括号之中，
使用分号分隔，后跟一个用于在循环中执行的语句（通常是一个块语句）。

• 示例

var i = 0;
for (; i < 9; i++) {
    console.log(i);
    // more statements
}

for…in

• 介绍

1.for...in语句以任意顺序遍历一个对象的除Symbol以外的可枚举属性。
2.for ... in是为遍历对象属性而构建的，不建议与数组一起使用
3.数组可以用Array.prototype.forEach()和for ... of
需要检查其中的任何键是否为某值的情况时，推荐用for ... in。
4.如果你只要考虑对象本身的属性，而不是它的原型，
那么使用 getOwnPropertyNames() 或执行 hasOwnProperty() 来确定某属性是否是对象本身的属性
（也能使用propertyIsEnumerable）

• 语法

for (variable in object)
  statement

• 示例

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

function ColoredTriangle() {
  this.color = 'red';
}

ColoredTriangle.prototype = triangle;

var obj = new ColoredTriangle();

for (var prop in obj) {
  if (obj.hasOwnProperty(prop)) {
    console.log(`obj.${prop} = ${obj[prop]}`);
  } 
}

// Output:
// "obj.color = red"

for…of

• 介绍

1.for...of语句在可迭代对象（包括 Array，Map，Set，String，TypedArray，arguments 对象等等）上创建一个迭代循环，调用自定义迭代钩子，并为每个不同属性的值执行语句
2.可以遍历Array
3.可以遍历Map，Set，arguments对象，dom对象
4.对于for...of的循环，可以由break, throw  continue    或return终止。

//for..in for...of 区别
for...in 语句以任意顺序迭代对象的可枚举属性。
for...of 语句遍历可迭代对象定义要迭代的数据。

• 示例

1. 迭代数组

let iterable = [10, 20, 30];

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

2. 迭代String

let iterable = "boo";

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

3. 迭代Map

let iterable = new Map([["a", 1], ["b", 2], ["c", 3]]);

for (let entry of iterable) {
  console.log(entry);
}
// ["a", 1]
// ["b", 2]
// ["c", 3]

for (let [key, value] of iterable) {
  console.log(value);
}
// 1
// 2
// 3

4. 迭代Set

let iterable = new Set([1, 1, 2, 2, 3, 3]);

for (let value of iterable) {
  console.log(value);
}
// 1
// 2
// 3

5. arguments对象

(function() {
  for (let argument of arguments) {
    console.log(argument);
  }
})(1, 2, 3);

// 1
// 2
// 3

forEach

forEach 是Array原型上的方法
循环不可中止