Javascript:生成可在窗口上下文中调用和扩展的自执行类

Question

这里有一些初学者问题，但我似乎无法找到解决我的问题的有效答案。我想编写一个自执行的全局 javascript 类“foo”，其方法可以从窗口上下文中调用(如 window.foo.bar() 或只是 foo.bar() 在 javascript 控制台中)，而无需实例化该类。

同时，我希望能够使用自定义函数扩展所述类，例如

foo.fn.baz = function() {}

这就是我到目前为止已经走了多远:

(function (window) {
var foo = function() {
    return this;
};
foo.fn = foo.prototype = {
    bar: function (string) {
        console.log(string);
    }
};
window.foo = foo;
})(window);

当我执行此 javascript 时，js 控制台现在知道类 foo，并且我可以通过 foo.fn.baz = function(){} 扩展其功能。但我无法调用这些函数:foo.bar未定义。

如果我将代码从 window.foo = foo; 更改为至window.foo = new foo(); ，然后我可以调用这些函数，但我不能扩展这个类了。

我该如何做到这一点？我的代码是否接近执行此类操作的正确方法？是否有可能同时获得这两件事？

有人有想法或提示吗？任何事情都会很棒。

谢谢

Answer 1

foo.bar is undefined

对。您已将方法放在函数的 prototype 属性上。 foo.prototype 引用的对象将被分配给您通过 new 运算符创建的实例，作为它们的底层原型(prototype)。所以:

var f = new foo();
f.bar();

如果你想要一个单例(foo本身就是one对象，你可以调用foo.bar())，你根本不需要原型(prototype):

window.foo = {
    bar: function(string) {
        console.log(string);
    }
};

...但是当您使用“类”这个词时，我的猜测是您确实希望使用 foo 创建多个实例，而不是使用 foo 直接，所以 new foo() 就是你想要的。

<小时/>

旁注:JavaScript 中压倒性的约定是，如果希望通过 new 调用函数，则该函数以大写字母开头。所以 Foo 而不是 foo。