javascript - 返回函数和使用 function.innerFunction 有什么区别？

Question

这是一个关于我似乎经常遇到的事情的一般性问题: 我应该什么时候使用

function Bla(){return function(){alert("bla");}}

并调用主函数Bla, 我应该什么时候使用

function Bla(){function innerBla(){alert("bla");}}

并调用Bla.innerBla?

它们有什么区别？

Answer 1

这是两种不同的做事方式，它们的运作方式也不同。

第一个是返回另一个函数的函数。因此，要调用内部函数，您需要先调用外部函数 Bla(返回内部函数)，然后调用返回值(内部函数):

function Bla(){
    return function(){
      alert("bla");
    }
}

Bla()(); // will alert "bla"

---

第二个只是定义了一个内部函数，并且没有办法从外部函数外部调用该内部函数，因为它的作用域仅在外部函数 Bla 内:

function Bla(){
    function innerBla () {
      alert("bla");
    }
}

Bla(); // will do 'nothing'

Bla.innerBla 是 undefined 因为对象(函数是 JavaScript 中的对象)Bla 没有名为 innerBla 的成员 附在上面。

---

如果你想像bla.innerBla那样调用它，你应该这样做:

function bla () { /* */ }

bla.innerBla = function () {
    alert("bla");
};

bla.innerBla(); 
// will alert "bla" because the `bla` object now has a member called `innerBla`.

或者你可以有这样的东西(我经常使用的模式):

function bla () {
    return {
        innerBla: function () {
            alert("bla");
        }
    };
}

bla().innerBla(); // will also alert "bla"

---

如果你想使用构造器模式(new)，你需要做这样的事情:

var bla = function () {
  this.innerBla = function () {
    alert("bla");
  };
};

var b = new bla();
b.innerBla();

这等同于在 OO 语言中的对象实例上具有公共(public)属性。

---

最后，如果您想通过每个“实例”公开 innerBla(使用构造函数实现，即使用 new 关键字调用 bla ) 的 bla，你应该将函数添加到 bar.prototype.innerBla:

var bla = function () { /* */ };
bla.prototype.innerBla = function () {
  alert("bla");
};

var b1 = new bla(), 
    b2 = new bla();

b1.innerBla(); // will alert "bla"
b2.innerBla(); // will also alert "bla"

这类似于静态方法。

---

附带说明一下，避免使用首字母大写字母 (pascal-case) 命名函数，因为按照惯例，通常我们只将需要使用 new 关键字调用的函数大写(构造函数)。