javascript - 在自定义 javascript 中创建类似 JQuery 的插件结构

Question

我不想创建 JQuery 插件

假设我有这样的东西:

// In folib.js
function Foo() {this.Prop = function() {//do something}};

这样我的用户就可以整天引用我的 JavaScript 库并实例化我的对象

// In consumer
foo = new Foo();
alert(foo.Prop);

现在，我想为我的类创建一个类似 JQuery 的插件系统，而我可以创建扩展 Foo() 的插件脚本库。

我想我应该做这样的事情......

(function( foo ){
    foo.myPlugin = function() {  
       // Do your awesome plugin stuff here
    };
})(Foo);

但我无法让它工作。关于如何在 JQuery 中完成此操作的任何想法？我想不通:(

Answer 1

使用原型(prototype):

Foo.prototype.myPlugin = function () { /* Do plugin stuff */ };

然后你就可以像这样访问插件了:

var foo = new Foo();
alert(foo.myPlugin);

原型(prototype)在与 new 结合使用时起作用:新对象 (foo) 有一个指向函数的 prototype 对象的隐藏指针它是从 (Foo) 构建的。如果在新对象上找不到属性，JS 将在原型(prototype)中搜索它。有关详细信息，请阅读 this .

jQuery 通过提供指向 prototype 的 fn 属性来做类似的事情:

Foo.fn = Foo.prototype;