for系列循环方法
<p>在es5中for循环包含了基础for循环,for-in,for-each</p>
<h4>基础for循环</h4>
<pre><code class="language-javascript">var arr = [1,2,3];
for(var i = 0;i<arr.length;i++){
console.log(i);
console.log(arr[i]);
}</code></pre>
<p>用于数组遍历,书写比较麻烦</p>
<h4>forEach</h4>
<p><code>forEach 不能 break 和 return</code></p>
<pre><code class="language-javascript">const arr = [1, 2, 3];
arr.forEach((data,index,array) => {
console.log(data);
});</code></pre>
<h4>for-in</h4>
<pre><code class="language-javascript">//遍历数组
var array = [1,2,3,4,5];
for(let index in array){
console.log(array[index]);//index为索引
}
//遍历对象
var object = {a:1,b:2,c:3,d:4};
for(let k in object){
console.log(object[k]);//k键名
}
</code></pre>
<p>for-in 缺点更加明显,它不仅遍历数组中的元素,还会遍历自定义的属性,甚至原型链上的属性都被访问到。而且,遍历数组元素的顺序可能是随机的。
for in <strong>循环中支持break</strong>,<strong>continue</strong>,不支持<strong>return</strong>
效率极低,为其他循环的1/7,<strong>不建议用于数组array类型</strong></p>
<h4>for-of</h4>
<pre><code class="language-javascript">const arr = ['a','b','c'];
for(let value of arr) {
console.log(value);//Value为键值
}
//结合entries(),同时得到索引值
const arr = ['a','b','c'];
for (let [index, value] of arr.entries()) {
console.log(index, value);
}</code></pre>
<p>总结一下,for-of 循环有以下几个特征:</p>
<p>这是最简洁、最直接的遍历数组元素的语法。
这个方法避开了 for-in 循环的所有缺陷。
与 forEach 不同的是,它<strong>可以正确响应 break、continue 和 return 语句</strong>。
其不仅可以遍历数组,还可以遍历类数组对象和其他可迭代对象。</p>