共计 1591 个字符，预计需要花费 4 分钟才能阅读完成。
咱们平时解决数据常常会用到 JS 循环遍历办法，数组的遍历办法有很多种，如 for、while、forEach、map 等，它们的执行效率各不相同，咱们来剖析比照一下。
创立一个有 1000w 条数据的数组，遍历该数组，比拟性能：
const data = new Array(1000000).fill(0);（1）一般 for 循环
最简略的一种遍历形式，也是最传统的循环语句，应用频率最高，性能较好，以下代码计算 10 次，取平均值（下同）。
console.time('for');
const result = [];
for (let i = 0; i < data.length; i++) {result.push(data[i]);
}
console.timeEnd('for');耗时：248.706ms
（2）优化版 for 循环
应用长期变量，将长度缓存起来，防止反复获取数组长度，尤其是当数组长度较大时优化成果才会更加显著。
console.time('for');
const result = [];
for (let i = 0, len = data.length; i < len; i++) {result.push(data[i]);
}
console.timeEnd('for');耗时：236.255ms
（3）while
while 循环会始终循环代码块，直到指定的条件为 false。比照 for 循环，for 中局部变量在循环完结后会被开释回收，while 须要在循环之前定义好变量，性能靠近。
console.time('while');
const result = [];
let i = 0, len = data.length;
while (i < len) {result.push(data[i]);
i++;
}
console.timeEnd('while');耗时：259.418ms
（4）forEach
对数组中的每一个元素运行给定的函数，没有返回值，应用频率较高，实际上性能比 for 循环弱。
console.time('forEach');
const result = [];
data.forEach(item => {result.push(item);
});
console.timeEnd('forEach');耗时：437.763ms
（5）map
返回一个新数组，数组中的元素为原始数组元素调用函数解决后的值，map 不会扭转原始数组。
console.time('map');
const result = [];
data.map(item => {result.push(item);
});
console.timeEnd('map');耗时：625.943ms
console.time('map');
const result = data.map(item => {return item;});
console.timeEnd('map');耗时：248.121ms
（6）for of
容许循环遍历可迭代的数据结构，例如数组、字符串、映射、节点列表等，然而不能遍历对象。
console.time('for of');
const result = [];
for (let item of data) {result.push(item);
}
console.timeEnd('for of');耗时：585.768ms
（7）for in
任意程序遍历一个对象的除 Symbol 以外的可枚举属性，包含继承的可枚举属性。
console.time('for in');
const result = [];
for (let key in data) {result.push(data[key]);
}
console.timeEnd('for in');耗时：10444.472ms
能够看出 for in 是效率最差的，起因是 for in 会遍历数组所有的可枚举属性，包含原型。解释器遇到 for in 循环时，在后盾须要为对象建设一个枚举器（enumerator），这是一个低廉的操作!