使用函数声明时的自定义函数(也称为惰性函数定义）

self-defining function(also called lazy function definition) when using function declaration

本文关键字：函数 定义 声明 自定义函数      更新时间：2023-09-26

在Stoyan Stefanov的"JavaScript Patterns"一书中，有一部分是关于自定义函数的。

var scareMe = function(){
    console.log("Boo!");
    scareMe = function(){
        console.log("Double Boo!"); 
    }
}
scareMe();//==>Boo!
scareMe();//==>Double Boo!

它按我的预期工作。但是我修改了scareMe功能，如下所示：

function scareMe(){
     console.log("Boo!");
     function scareMe(){
         console.log("Double Boo!");
     }
 }
 scareMe();//==>Boo!
 scareMe();//==>Boo!

问题：

  1. 它们之间有什么区别？
  2. 在第二种情况下，为什么输出不是"Double Boo！"，而是"Boo！
调用

时的第一个scareMe函数通过在内部创建另一个scareMe来覆盖自己的行为，该函数覆盖了上部作用域中的函数，因此原始scareMe的定义发生了变化，如果您想在应用程序中进行第一次设置并希望在设置后立即更改其行为，我已经看到使用了这种方法。

如果您定义了：

var scareMe = function(){
    console.log("Boo!");
    var scareMe = function(){ //define it with var
        console.log("Double boo!"); 
    }
}
scareMe();//==>Boo!
scareMe();//==>Boo! //you will see the behavior as that of the second one.

也是一次性设置的一个实际实现：

var scareMe = function(){
    console.log("Boo!");
   //I have done my job now. I am no longer needed.
    scareMe = undefined;
}
scareMe();//==>Boo!
scareMe();//==> oops error

第二种情况是创建一个名为 scareMe 的新函数，其作用域仅在函数内，它不会覆盖自身。

例如，尝试一下：

function scareMe(){
     console.log("Boo!");
     function scareMe(){
         console.log("Double bool!");
     }
    scareMe(); //Now this invokes the once defined inside the scope of this function itself.
 }
 scareMe();//==>Boo! and Double bool!

在你的第一个应用程序中，scareMe是一个全局变量（在你的上下文中）。在"双嘘"中，您更改该全局变量的值，因此它可以工作。在第二个应用中，内部 scareMe 是一个局部变量，它不会改变全局变量的值。所以这是关于变量范围。

除了提升和可调试性之外，您还可以考虑：

function f(/* ... */) { /* ... */ }

等效于：

var f = function(/* ... */) { /* ... */ };

如果我们将您的第二个代码示例转换为使用第二种形式，我们将得到：

var scareMe = function() {
    console.log("Boo!");
    var scareMe = function() {
        console.log("Double bool!");
    };
};

请注意，这与第一个代码段不同;内部函数定义有一个var。使用内部var，它创建一个名为scareMe的新变量，该变量遮蔽了外部变量。

相关文章：