JavaScript嵌套箭头函数的内存影响

Question

请思考：

function f1() {
  function n11() { .. lots of code .. };
  const n12 = () => { .. lots of code .. };
  return n11()+n12()+5;
}

const f2 = () => {
  function n21() { .. lots of code .. };
  const n22 = () => { .. lots of code .. };
  return n21()+n22()+5;
}

我正在尝试理解调用f1和f2的内存影响。

关于n11，这个答案说：

对于一些非常小且通常不重要的“浪费”值。 现代JavaScript引擎非常高效，可以执行各种技巧/优化。例如， 只需要在内部“复制”函数对象（但不是实际的函数代码！）。 没有实际测试用例证明存在“浪费”问题。 这种嵌套和匿名函数的习惯在JavaScript中非常常见，并且已经得到了很好的优化。

然而，我想知道这是否也适用于箭头函数（即n12、n21和n22）...每次调用f1/f2时，开销是否仅为函数对象，如上所述，还是整个嵌套函数代码都会被复制？

谢谢！

- kofifus

---

可能取决于JavaScript引擎。您对哪一个感到好奇？ - Felix Kling

这是一个更为普遍的问题，但是针对现代浏览器...有些浏览器在这方面表现更好/更差吗？ - kofifus

嗯，“通常情况下”，引擎并不需要做这些事情。规范并不要求它们这样做。然而，我不认为箭头函数和“普通”的函数在这方面应该有任何区别。但是，如果你想具体了解一个引擎是否这样做，那么你可能需要查看它的源代码。 - Felix Kling

这个回答声称箭头函数只是常规函数的语法糖。因此，我想象它们对内存的影响与常规函数相同。 - djfdev

为什么要嵌套函数？ - Ronnie Royston

Ron - 这样他们就可以访问周围的闭包。 - kofifus

Answer 1

在将同一函数的不同闭包之间的代码共享方面，箭头函数与传统函数没有任何不同之处，因此实现无需对箭头函数采取任何特别行动。箭头函数与传统函数唯一的区别在于箭头函数保存了this值。可以使用已经为Function.prototype.bind()方法提供的相同机制来完成此操作。箭头函数基本上只是语法糖。

func = () => { body };

大致相当于：

func = function() { body }.bind(this);

（这是略微简化的，因为箭头函数也不会得到一个arguments对象，但这不应该影响您所问的内容。）

（这是一个轻微的简化，因为箭头函数也没有得到一个arguments对象，但这不应该影响你所问的问题。）

- Barmar

---

谢谢！您是否有任何信息表明嵌套函数（箭头函数或常规函数）实际上已经被优化了？ - kofifus

嵌套函数并不需要复制代码。所有涉及变量作用域的内容都在函数的闭包数据中处理，而不是在代码中处理。 - Barmar