js 循环有哪些？

for / for-in / for-of / foreach 专门为循环设计

map / filter ... 虽然代码工作过程中也会产生循环，但是设计的目的不是为了循环对象

for-in

可以循环数组/普通对象。
for-in遍历数组的时候，顺序（序列）是不能保证的，迭代循环得到的是索引/key或原型链找到的属性,循环中可以打断循环或退出循环。
使用for-in进行循环也被称为“枚举”，不但能枚举到数组自身的索引，也能通过原型链枚举到原型对象的属性。
如果数组某一项是空（不是null或undefined，见下面的例子），则不会循环。

Object.prototype.abc = '123'

let arr = [{a: "a"}, "bbb", undefined, , '', 123]
for(let a in arr) {
  console.log(a); // 0 1 2 4 5 abc
}
for(let a in arr) {
  if (arr.hasOwnProperty(a)) {
    if (a === '2') {
      continue;
    }
    console.log(a); // 0 1 4 5
  } else {
    break
  }
}

for-of

包括 Array，Map，Set，String，TypedArray，arguments 对象等等都能迭代。
循环数组的时候，从0开始，按顺序遍历数组，得到的是数组的每一项元素。
循环过程中，可以打断某次循环，或退出循环。
如果数组某一项是空（不是null或undefined，见下面的例子），则会返回undefined。

Object.prototype.abc = '123'
let arr = [{a: "a"}, "bbb", undefined, , '', 123]

for(let val of arr) {
  console.log(val); // {a: "a"}, "bbb", undefined, undefined, '', 123
}
for(let val of arr) {
  if (val === 'bbb') {
    continue;
  }
  else if (val === '') {
    break;
  }
  console.log(val); // {a: "a"}, undefined, undefined
}

打印：

image.png

foreach

只能循环数组。
从0开始，按顺序遍历数组，得到的是数组的每一项元素，除了抛出异常以外，没有办法中止或跳出 forEach() 循环。
如果数组某一项是空（不是null或undefined，见下面的例子），则不会循环。

Object.prototype.abc = '123'
let arr = [{a: "a"}, "bbb", undefined, , '', 123]
arr.forEach(item => {
  console.log(item); // {a: "a"}, "bbb", undefined, '', 123
});