Javascript 您可以使用JS对象作为JQuery插件的接口吗？

我已经看过这个帖子了：，虽然有很多关于多功能插件的解决方案，但我感兴趣的是，是否可以使用一个对象，这样你就不会有像

$（“选择器”）.plugin（）.dostuff（）

，这样丑陋的结构，而可以像这样使用它：

$（“选择器”）.plugin.dostuff（）

，ie“插件”是一个对象而不是一个函数

我可以这样编写插件：

$.fn.plugin = {
    dostuff: function() {},
    domorestuff: function(){}
};

---

但是内部函数将无法访问首先调用它的JQuery对象，因为

这个

返回插件对象。有没有什么方法可以基于一个可以与JQuery一起工作的对象来构造插件？

没有，并且由于您给出的原因：您丢失了

这个
，而
这个
在编写插件时非常重要。要获取此
，您的插件必须是函数

基本上有三种实现方法的方法：

使用字符串参数，例如：

$("selector").plugin("dostuff");

…在插件函数中分派给处理程序方法。这是目前最流行的方式。这是jQueryUI、Bootstrap和其他人使用的方式。下面是一个完整的例子

使用你所说的“丑陋的结构”，你的插件是一个函数，它返回一个对象（每次都是一个新的对象，以保留
这个
）和你可以调用的函数

使用某种前缀向jQuery添加几个插件方法，而不仅仅是一个，因此它最终成为
$（“选择器”）.pluginDoThis（）
和
$（“选择器”）.pluginDoThat（）
和
$（“选择器”）.pluginother（）关键是使用前缀以避免名称冲突。很久以前，我只见过一次这样的插件，但我已经有一段时间没见过了。不是很受欢迎的选择

我最近刚刚发布了一篇文章，展示了#1的完整模式（在他们的例子中，方法是
callThis
和
destroy
），例如：


//创建插件
（函数（$）{
var方法={
初始化：函数（选项）{
//确定选项
var opts=$.extend({
不透明度：0.5
}，选项）；
//记住他们
这个数据（“pluginname”，opts）；
//初始材料
css（“不透明度”，opts.opacity）；
},
调用此函数（opts）{
//如果相关，请使用“选项”
css（“显示”、“无”）；
},
销毁：功能（opts）{
这个.removeData（“pluginame”）；
css（“display”，“display”）.css（“opacity”，“opacity”）；
}
};
jQuery.fn.pluginname=函数（选项）{
var方法，args；
//方法？
如果（选项类型==“字符串”）{
//是的，记下名字
方法=选项；
//和参数（我们复制参数，然后
//用我们的选项替换第一个选项）
args=Array.prototype.slice.call（参数，0）；
//从安装呼叫获取我们的选项
args[0]=this.data（“pluginname”）；
如果（！args[0]）{
//没有安装调用，请使用默认设置进行安装
方法初始化调用（this）；
args[0]=this.data（“pluginname”）；
}
}
否则{
//不是方法调用，请使用init
method=“init”；
args=[选项]；
}
//打电话
方法[method].apply（this，args）；
};
})（jQuery）；
//示例用法
函数doInit（）{
$（“#目标”）.pluginname（）；
setTimeout（doCallThis，700）；
}
函数doCallThis（）{
$（“#target”）.pluginname（“callThis”）；
设置超时（doDestroy，700）；
}
函数doDestroy（）{
$（“#目标”）.pluginname（“销毁”）；
setTimeout（doInit，700）；
}
setTimeout（doInit，700）
这就是目标
好吧，你说服了我。但是你能解释一下为什么
这个
在你的例子中有效而在我的例子中无效吗？@Miguel:因为JavaScript中的
这个
主要是由函数的调用方式设置的：如果你通过对象属性调用函数，在调用中，
这个
指的是那个对象（通常）。所以
foo.bar（）
调用
bar
，其中
此
等于
foo
<代码>$（“选择器”）.plugin（）
调用
插件
，该
等于
$（“选择器”）
返回的jQuery对象。但是
$（“选择器”）.plugin.method（）
调用
方法
，其中
此
等于
插件
，而不是jQuery对象；对jQuery对象的引用已丢失。但在您的示例中，没有
methods[method].apply（这是args）涉及调用对象的方法“方法”？那么为什么
this
没有设置为“methods”？米格尔：因为附加到函数的
apply
（和
call
）函数是特殊的：它们存在的理由是调用具有指定
this
值的函数（在第一个参数中给出）。