web前端 - JS中的4个for循环

在 ECMAScript5（简称 ES5）中，有三个循环。在 2015 年 6 月发布的 ECMAScript6（简称 ES6）中，新增了一种循环类型。他们是：

for

for in

for each

for of

今天，就让我们一起来看看这4个 for 循环。

1、简单的for循环

我们来看看最常见的写法：

const arr = [1, 2, 3];

for(let i = 0; i < arr.length; i++) {

console.log(arr[i]);

}

当循环中数组的长度没有变化时，我们应该将数组的长度存储在一个变量中，这样效率会更高。下面是改进的写法：

const arr = [1, 2, 3];

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

console.log(arr[i]);

}

2、for-in

2.1、 使用 for-in

通常，我们可以使用for-in来遍历数组的内容，代码如下：

const arr = [1, 2, 3];

let index;

for(index in arr) {

console.log(“arr[“ + index + “] = “ + arr[index]);

}

一般来说，操作的结果如下：

arr[0] = 1

arr[1] = 2

arr[2] = 3

但这样做往往会产生问题。

2.2、 for-in的真相

for-in 循环遍历对象的属性，而不是数组的索引。所以for-in遍历的对象不限于数组，也可以遍历对象。示例如下：

const person = {

fname: “san”,

lname: “zhang”,

age: 99

};

let info;

for(info in person) {

console.log(“person[“ + info + “] = “ + person[info]);

}

结果如下：

person[fname] = san

person[lname] = zhang

person[age] = 99

需要注意的是for-in遍历属性的顺序是不确定的，即输出结果的顺序与对象中属性的顺序无关，也与属性的字母顺序无关，也没有任何其他顺序。

2.3 、关于数组的真相

数组是Javascript中的一个对象，Array的索引是属性名。事实上，Javascript 中的“数组”有点