在ECMAScript5（简称ES5）中，一共有三种for循环，分别是：Simpleforloopfor-inforEach在2015年6月发布的ECMAScript6（简称ES6）中，新增了一个一种循环是：for-of我们来看看这4种for循环。简单的for循环我们来看看最常见的写法：constarr=[1,2,3];for(leti=0;i {console.log(data);});运行结果：123forEach方法对数组中每一项包含有效值的项执行一次回调函数，那些已经删除（使用delete方法等）或从未赋值的项将被跳过（不包括那些值为未定义或null的）。回调函数会依次传入三个参数：数组中当前项的值；数组中当前项的索引；数组对象本身；需要注意的是，forEach遍历的范围会在第一次调用回调之前确定。调用forEach后添加到数组的项目将不会被回调访问。如果已经存在的值被更改，则传递给回调的值是forEach遍历到它们时的值。不遍历删除的项目。constarr=[];arr[0]="a";arr[3]="b";arr[10]="c";arr.name="Helloworld";arr.forEach((data,index,array)=>{console.log(data,index,array);});运行结果：a0["a",3:"b",10:"c",name:"Helloworld"]b3["a",3:"b",10:"c",name:"Helloworld"]c10["a",3:"b",10:"c",name:"Helloworld"]这里的索引是Number类型，不会遍历原型链上的属性像for-in。因此，在使用forEach的时候，我们不需要特别声明要遍历的索引和元素，因为这些都是作为回调函数的参数。此外，forEach会遍历数组中的所有元素，但是ES5定义了一些其他有用的方法，这里有一些：every：先循环返回后返回falsesome：循环返回后先返回truefilter：返回一个新的数组，数组中的元素满足回调函数map：对原数组中的元素进行处理后返回reduce：依次对数组中的元素进行处理，将上一次处理的结果作为下一次处理的输入，***得到最后结果。ForEachperformance首先感谢@papapa的提醒，我发现之前的理解是错误的。可以看看jsPerf，在不同浏览器的测试结果是forEach没有for快。如果将测试代码放在控制台上，可能会得到不同的结果。主要原因是控制台的执行环境和真正的代码执行环境不一样。for-of先来看一个例子：constarr=['a','b','c'];for(letdataofarr){console.log(data);}运行结果为：为什么abc要引入for-of？要回答这个问题，我们先来看看ES6之前的三个for循环的缺陷：forEach不能break和return；for-in有更明显的缺点，它不仅要遍历数组中的元素，还要遍历自定义属性，甚至访问原型链上的属性。此外，遍历数组元素的顺序可能是随机的。因此，针对以上缺陷，我们需要对原有的for循环进行改进。但是ES6不会破坏您已经编写的JS代码。目前有数以千计的网站依赖for-in循环，其中一些甚至将其用于数组遍历。通过修复for-in循环来添加数组遍历支持会使这一切更加混乱，因此标准委员会为ES6添加了一个新的循环语法来解决当前的问题，即for-of。那么for-of到底能做什么呢？与forEach相比，可以正确响应break、continue、return。for-of循??环不仅支持数组，还支持大多数类数组对象，例如DOMnodelist对象。for-of循环还支持字符串遍历，将一个字符串当作一系列Unicode字符进行遍历。for-of还支持Map和Set（都是ES6中新增的）对象遍历。总结一下，for-of循环有以下特点：这是遍历数组元素最简洁直接的语法。这种方法避免了for-in循环的所有缺陷。与forEach不同，它可以正确响应break、continue和return语句。它不仅可以遍历数组，还可以遍历类数组对象和其他可迭代对象。但是需要注意的是for-of循环不支持普通对象，但是如果你想遍历一个对象的属性，可以使用for-in循环（这也是它的原生工作）。***我想说的是ES6引入的另一种方法也可以实现遍历数组的值，那就是Iterator。最后一个例子：constarr=['a','b','c'];constiter=arr[Symbol.iterator]();iter.next()//{value:'a',done:false}iter.next()//{value:'b',done:false}iter.next()//{value:'c',done:false}iter.next()//{value:undefined,done:true}不过这个内容超出了本文的范围，Iterator也有很多想说的。以后有时间专门写一篇文章，欢迎关注。
