前言
前端开发中经常涉及到数组的相关操作：去重、过滤、求和、数据二次处理等等。都需要我们对数组进行循环。为了满足各种需求，JS除了提供最简单的for循环，在ES6和后续版本中也新增的诸如：map、filter、some、reduce等实用的方法。
各个方法都有他们的应用场景，过分追求性能，往往会忽略语义和可读性。
冷静地分析一下，如果只谈性能，显然是 for > forEach > map
为什么 for 的性能比较好？读一下 forEach 和 map 的规范就知道了。
至于foreach和map，map 会返回一个等长数组，forEach 不会，所以 forEach 大于 map。
但是哪个更快，和哪个更合适，并不应该划等号：
如果需要将数组按照某种规则映射为另一个数组 ? map
如果需要进行简单的遍历 ? forEach 或者 for of
如果需要对迭代器进行遍历 ? for of
如果需要过滤出符合条件的项 ? filter
如果需要先按照规则映射为新数组，再根据条件过滤 ? map + filter。
但是遇到明确强调性能的场景，依旧是推荐使用for，for的性能应该是毋庸置疑的。
for循环的四种写法
const persons = ['1', '2', '3', '4', '5', '6']
// 方法一
for (let i = 0; i < persons.length; i++) {console.log(persons[i])
}
// 方法二
for (let i = 0, len = persons.length; i < len; i++) {console.log(persons[i])
}
// 方法三
for (let i = 0, person; person = persons[i]; i++) {console.log(person)
}
// 方法四
for (let i = persons.length; i--;) {console.log(persons[i])
}
-
第一种方法是最常见的方式，不解释。
-
第二种方法是将
persons.length缓存到变量len中,这样每次循环时就不会再读取数组的长度。 -
第三种方式是将取值与判断合并，通过不停的枚举每一项来循环，直到枚举到空值则循环结束。执行顺序是：
- 第一步：先声明索引
i = 0和变量person - 第二步：取出数组的第
i项persons[i]赋值给变量person并判断是否为Truthy - 第三步：执行循环体，打印
person - 第四步：
i++。当第二步中
person的值不再是Truthy时，循环结束。方法三甚至可以这样写for (let i = 0, person; person = persons[i++];) {console.log(person) } 复制代码
- 第一步：先声明索引
-
第四种方法是倒序循环。执行的顺序是：
- 第一步：获取数组长度，赋值给变量
i - 第二步：判断
i是否大于0并执行i-- - 第三步：执行循环体，打印
persons[i]，此时的i已经-1了从后向前，直到
i === 0为止。这种方式不仅去除了每次循环中读取数组长度的操作,而且只创建了一个变量i。
- 第一步：获取数组长度，赋值给变量