Question

我很好奇循环外函数与内联函数之间的性能差异：

循环之外：

const reducer = (acc, val) => {
  // work
};

largeArray.reduce(reducer);

内联：

largeArray.reduce((acc, val) => {
  // work
});

我经常遇到这种情况，除非我要重用该函数，否则避免使用内联版本将另一个变量引入我的作用域似乎很有用。

这两个示例在性能上是否存在差异，或者JS引擎是否对它们进行了优化？

例如：是否在每次循环运行时创建内联函数，然后进行垃圾回收？如果是这样的话：

这会对性能产生什么样的影响，
函数的大小会对此产生影响吗？例如，一个200字符对30_000个Unicode字符的函数。

还有其他差异或我不在考虑的事情吗？

希望您了解我的思路，并可以对此提供一些见解。我意识到我可以阅读V8或其他引擎的所有文档和源代码，并且可以得到答案，但这对于理解这个概念来说似乎是一项艰巨的任务。

Answer 1

我确实在jsben上进行了测试

SET1（随机使用两次）：http://jsben.ch/8Dukx

SET2 ：（使用一次）：http://jsben.ch/SnvxV

设置

const arr = [ ...Array(100).keys() ];
const reducer = (acc, cur) => (acc + cur);

测试1

let sumInline = arr.reduce((acc, cur) => (acc + cur), 0);
let sumInlineHalf = arr.slice(0, 50).reduce((acc, cur) => (acc + cur), 0);

console.log(sumInline, sumInlineHalf);

测试2

let sumOutline = arr.reduce(reducer, 0);
let sumOutlineHalf = arr.slice(0, 50).reduce(reducer, 0);

console.log(sumOutline, sumOutlineHalf);

惊讶

Answer 2

这会对性能产生什么样的影响，

没有。

函数的大小会对此产生影响吗？例如，一个函数是200个vs 30_000个Unicode字符。

函数不作为“ unicode字符”执行。不管代码有多长。

还有其他差异或我不在考虑的事情吗？

非常重要的一个：代码是为人类而不是计算机编写的。还有why do you even ask me?

是否在每次循环运行时创建内联函数，然后进行垃圾回收？

那将是不必要和缓慢的。大概是这样：

函数初始化位置之间的性能差异[JavaScript]

2 个答案: