面试题：JavaScript数组迭代性能优化之基础运用

Question

假设有一个包含1000个数字的数组，需要对数组中的每个元素进行平方运算，并返回新的数组。请分别使用for循环、`map`方法来实现，并简要说明从性能角度考虑，在这种场景下哪种方式更优，为什么。

Answer 1

使用for循环实现

let arr = Array.from({ length: 1000 }, (_, i) => i + 1);
let newArr1 = [];
for (let i = 0; i < arr.length; i++) {
    newArr1.push(arr[i] * arr[i]);
}
console.log(newArr1);

使用map方法实现

let arr = Array.from({ length: 1000 }, (_, i) => i + 1);
let newArr2 = arr.map(num => num * num);
console.log(newArr2);

性能比较

从性能角度考虑，在现代JavaScript引擎中，两者性能差异不大。但理论上，for循环可能会略胜一筹。原因如下：

• for循环：它是一个基础的循环结构，执行过程中没有额外的函数调用开销。JavaScript引擎在优化for循环方面有成熟的机制，对于简单的数组遍历和操作，for循环直接控制索引进行操作，相对更直接高效。
• map方法：map方法内部实现也是循环，但它是一个高阶函数，每次迭代都需要调用传入的回调函数，这会带来额外的函数调用开销，包括创建函数作用域、参数传递等操作，在大规模数据下，这种开销的积累可能导致性能略微降低。不过，现代JavaScript引擎对map这类数组方法也进行了大量优化，在数据量不是特别巨大时，性能差异难以察觉。