JS中常用的 for 循环方式有 for、for…in、forEach、for…of循环等。

1.for

一般格式

 

 

 例如:

 

 

 后台显示

2.for…in…

一般格式

 

 

 

 for…in… 为ES5标准，主要为获取对象的属性名，同样可以用来遍历数组元素。

由于每次都需要搜索实例和原型属性，所以在性能上要比其他循环类型性能低,并且自身参数值是数组下标。适用于Array和Object。

3.for 与 for…in…对比

标准for循环中ｉ为 number 类型，而 for…in…中，i 表示的是数组的 key 是string类型,因为js中一切皆为对象。

for…in… 方法在遍历过程中会访问原型上的所有属性，如果扩展了js原生的Array类，则会影响遍历结果。

4.forEach

forEach方法为ES5推出的另一种遍历数组的方法，forEach() 方法用于调用数组的每个元素，并将元素传递给回调函数。针对可迭代对象(Array, Map, Set, arguments等)

注意: forEach() 对于空数组是不会执行回调函数的。

 

比起传统for循环，它不需要判断条件，写起来更加简便

forEach 方法没办法使用 break 语句跳出循环，或者使用return从函数体内返回

5.for…of

for…of 为ES6中提出的循环机制，for…of 语句在可迭代对象（包括 Array，Map，Set，String，TypedArray，arguments 对象等)上

创建一个迭代循环，调用自定义迭代钩子，并为每个不同属性的值执行语句。