javascript - 在 if 语句中声明或不声明函数的原因

Question

我需要对屏幕后面发生的事情进行一些确认。

MDN 中有一篇文章说我们不应该在 block 级中声明函数，例如在 if 语句中。因为它在整个浏览器中以及与 pre-ES2015(或 pre-ES6)有关的任何事情都不一致。

除非条件为真，否则不会创建 if 语句中的函数。

我在想，如果条件为真，假设 JavaScript 加载并同步设置 5 分钟后，它会创建函数吗？为了创建函数，它是否仍然有代码的内存，或者它是否被转储在未使用的代码中？

我想知道即使在 if 语句完成后该功能是否仍然存在。它可以访问吗？多久可以访问？在 if 条件为假之前是否可以访问？结果是否与 ES6 和 pre-ES6 不同？我听说 if 语句中没有 ES6 之前的范围。

例如
if (condition) {
function foo() {console.log(“hello world”);
}
}
在阅读了 MDN 中“非严格代码中的 block 级函数”下的“函数”文章后，我感到困惑:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions

Answer 1

IF the condition is true, let’s say 5 minutes later after JavaScript is loaded and set synchronously, will it create the function?

该函数将在 if 后立即创建。运行，立即。

Does it still have memory of the code in order to create the function, or is it dumped in unused code and all?

I would like to know whether the function still exists even after the if-statement is completed. Is it accessible? How long is it accessible?

无论函数是否在 if 中声明，此行为都是相同的。 block 与否:如果将来没有任何东西可以引用该函数(例如，如果 block 结束并且 block 内没有对该函数的引用)，它最终将被垃圾回收。在 GC 运行之前，该函数可能仍“存在”在内存中一段时间​​。
例如，应该清楚以下功能应该始终存在，至少在您重新加载页面之前:

// IIFE, to get off the top level
(() => {
  if (true) {
    function foo() {
      console.log('clicked');
    }
    window.addEventListener('click', foo);
  }
})();

这是因为 addEventListener已传递对该函数的引用。
但以下 foo函数将被 GC 处理(可能在页面加载后一秒钟或几秒钟 - 它取决于底层引擎，并且对 Javascript 不可见):

// IIFE, to get off the top level
(() => {
  if (true) {
    function foo() {
      console.log('clicked');
    }
  }
})();

如果在作用域变量的 block 完成时没有保存对该函数的引用，则该函数将无法在任何地方访问，并且将被 GCd。
问题的其余部分看起来基本相同:“在哪里可以引用函数”，这在 Bergi 的回答 here 中得到了最好的描述。 .这有点复杂，并且行为会有所不同，具体取决于您是否使用严格模式、环境的 ES 版本和环境本身(实现 not always 符合规范)。
对于可预测、易于阅读的代码，最好不要在非功能 block 中使用函数声明；仅在直接在功能 block 内时使用函数声明。
(请注意，函数表达式，其中函数用作值并传递给某物或立即调用或显式分配给变量，与函数声明不同 - 函数表达式很好，只是函数声明的奇怪行为有问题。另请注意，根据评论，“函数声明”有时称为“函数语句”。)