JavaScript的几种循环使用方式及性能解析

循环的类型

一：for

var arr = [1, 2, 3, 4, 5, 6];

for (var i = 0, len = arr.length; i < len; i++) {

console.log(arr[i]);

}

　　

在for循环中定义的新变量相当于在循环体外定义的变量，所以可以写成如下格式。

var i = 0, len = arr.length;

for (; i < len; i++) {

console.log(arr[i]);

}

　　

每次循环执行结束都会对i进行增量操作（增量可以为负数），所以可以将增量操作写到代码块最后执行。

i++只是其中常用写法，也可以是i = i +2其他方式。

1. var i = 0, len = arr.length;
   
   for (; i < len;) {
   
   console.log(arr[i]);
   
   i++;
   
   }

二：for-in  一般用于遍历对象

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

for (var key in obj) {

console.log(key + ": " + obj[key]); //a: 1 b:2 c:3

}

三：for-of   ES6新增！ 允许遍历数组、字符串、Map等可迭代的数据结构！

var arr = [1, 2, 3, 4, 5];

for (var v of arr) {

console.log( v); //1 2 3 4 5

}

var str = "abcdefg";

for (var v of str) {

console.log(v); //a b c d e f g

}

四：while

var i = 0;

while(i < 5) {

console.log(i); //0 1 2 3 4

i++;

}

五：do-while

var i = 0;

do {

console.log("do: " + i); //0 1 2 3 4

i++;

}

while(i < 5)

　　

do-while循环是while的一个变形，先执行在判断，所以它至少会执行一次。

var i = 10;

do {

console.log("do: " + i); //10

i++;

}

while(i < 5)

　　

循环的性能！！！

for-in的循环性能是明显慢与其他几种循环，它的每次迭代操作的同时都是会去搜索原型或者原型属性，产生额外开销，所以

避免使用for-in循环！云服务器Window Server 2012R系统安装MySQL的详细教程

不要用for-in来迭代数组！

性能优化！！！

1：减少迭代的工作量，减少对象成员及数组项的查找次数

2：倒序循环，会略微提升性能

var arr = [1, 2, 3, 4, 5];

for (var i = arr.length; i--;) { //将控制条件简单的与零比较，任何非零数自动转为true，而零值则为false。

console.log(i); //从两次迭代比较（迭代数小于总数吗？他是否为true？）减为一次（它是true吗？）

}

　　

1+2优化可以提升运行速度比原始版本快50%~60%。

PS：基于函数的迭代forEach()被原生支持，但是他的速度慢于基于循环的迭代，因为它对每个数组项都调用外部方法所带来的开销比较大，这是速度慢的主要原因，基于循环的迭代是基于函数迭代速度快八倍，所以forEach()一般不作于循环的选择。