javascript 四种for循环

本文将按照出现的先后顺序总结 JavaScript for 循环的4种编写方式。阅读后，你可以像专家一样正确使用它们。

---

1.C 风格的“三表达式” For 循环

这是自 ECMAScript 3 (ES3) 以来可用的老式方法。我们可以用三表达式样式来编写 for 循环：

var a = [1,2,3,4]
for (var i =o; i<a.length; i++){
	console.log(a[i])
}

不用说，这是一种经典的 C 风格方式。 如果我们愿意，我们可以一直使用这种时尚。 但它在现代 JavaScript 项目中不像以前那么流行，因为我们现在有更方便的方法。

2.“for…in…”循环

为了使对象的迭代更容易，有一个“for…in…”语法，它也可以从 ES3 获得。

var author = {name: 'chan',age: 200}
for (var k in author) {
	console.log(k+ ':' + author[k])
}
// name : chan
// age : 20

使用这种方式的最佳实践是永远不要将它用于数组.

---

由于数组也是幕后的对象，每一项的索引都被视为对象的属性，索引顺序是依赖于实现的，数组值可能不会按照你期望的顺序访问。应用“for...in... ”到数组可能会导致一些意想不到的结果。

Array.prototype.foo = 1
var a = [1,2,3,4,5]
for (var x in a) {
	console.log(x)
}
// 0 1 2 3 4 foo

因此，为了使你的代码没有错误，永远不要将“for…in…”应用于数组。

3.数组上的“forEach”方法

由于“for…in…”不适用于数组。 应该有更好的迭代 JavaScript 数组的方法。 所以 ES5 引入了数组的迭代方法。 在我看来，这种改进使 JavaScript 变得优雅。

var a = [1,2,3,4]
a.forEach(function(val){
	console.log(val)
})
// 1 2 3 4

4.ES6 中的“for…of…”语法

众所周知，ES6 是 JavaScript 的里程碑。 这个版本引入了许多很棒的功能。 “for…of…”方法就是其中之一。 它使事情变得更加优雅。

var a = [1,2,3,4]
for (let char of a) {
	console.log(char)
}
// 1 2 3 4