Javascript jQuery插件-提供API

我目前正在开发一个相当复杂的jQuery插件。我正在设计一个可扩展的。我面临的难题是如何准确地为用户提供可用的API

我可以想出两种方法：

通过全局范围内的对象提供API

这是我目前使用的方法。我的做法与此类似：

(function ($, win, undefined) {
    //main plugin functionality
    function pluginStuff() { /*...including method calling logic...*/ }

    //register function with jQuery
    $.fn.extend({ Plugin: pluginStuff });

    //register global API variable
    win.PluginAPI = { extendMe: {}, getVar: function() {} };
})(jQuery, window);

(function ($, win, undefined) {
    //main plugin functionality
    function pluginStuff() { /*...including method calling logic...*/ }

    //register function with jQuery
    $.fn.Plugin = pluginStuff;

    //register global API variable
    $.Plugin = { extendMe: {}, getVar: function() {} };
})(jQuery, window);

不幸的是，由于我实现了标准的

$（）.plugin（'method'）

体系结构，因此必须对某些事情使用jQuery方法，而对其他事情使用API变量有点奇怪

通过放置在jQuery中的对象提供API

我也曾尝试过这种方法，但它的最佳实践是只占用jquerys

fn

scope中的一个插槽，以免挤满jQuery变量。在这种方法中，我将api变量放在

$.fn

中，而不是

窗口中

：

//register function with jQuery
$.fn.extend({ Plugin: pluginStuff });

//register global API variable
$.fn.PluginAPI = { extendMe: {}, getVar: function() {} };

我宁愿不打破这个惯例，占据两个位置

---

现在我写了这篇文章，我可以看到第三个选项，在这里我将jQuery的

fn

范围中的插件槽指定为一个对象：

$.fn.Plugin = { plugin: pluginStuff, api: { extendMe: {}, getVar: function() {} } };

但是，如果用户必须执行

$（'#elm'）.Plugin.Plugin（{setting:'value'}）

来创建插件的新实例，那么这会有多好的效果呢

任何帮助或指点都将不胜感激

---

请注意：我不是在寻找将API对象合并到插件功能中的方法。我正在寻找一种方法，使其单独模块化，但直观地可供使用/扩展。

您随时可以这样做

var plugin = function plugin() { /* do the main stuff */ };
// api stuff here
plugin.getVar = function() { };
plugin.extendMe = {};

$.fn.Plugin = plugin;

或者将额外的内容粘贴到指定给

plugin.api

的对象中

---

不过，不管你怎么做，你都得担心设置会互相渗透。因为所有东西都将使用相同的函数，无论您选择如何设置它，您都需要一种方法使插件的调用彼此分离。例如，可以使用类似于this.selector的东西（在插件函数中）作为属性关联数组的键。我通常会建议

.data（）

将设置附加到单个元素，但如果同一个元素两次调用插件，则没有多大帮助。

我最终决定使用的方法是在

fn

命名空间下注册插件，在jQuery

$

命名空间下注册api变量。由于方法和选项集在插件的实例上运行，

$。fn

是最佳选择

但是，API是全局的，不链接到单个实例。在这种情况下，

$.fn

不太合适。我最终使用的是类似的东西：

(function ($, win, undefined) {
    //main plugin functionality
    function pluginStuff() { /*...including method calling logic...*/ }

    //register function with jQuery
    $.fn.extend({ Plugin: pluginStuff });

    //register global API variable
    win.PluginAPI = { extendMe: {}, getVar: function() {} };
})(jQuery, window);

(function ($, win, undefined) {
    //main plugin functionality
    function pluginStuff() { /*...including method calling logic...*/ }

    //register function with jQuery
    $.fn.Plugin = pluginStuff;

    //register global API variable
    $.Plugin = { extendMe: {}, getVar: function() {} };
})(jQuery, window);

现在，您可以按预期创建使用插件对象：

$('#elm').Plugin();
$('#elm').Plugin('option', 'something', 'value');
$('#elm').Plugin('method');

您还可以轻松地扩展和访问API：

$.extend($.Plugin.extendMe, {
    moreStuff: {}
});
$.Plugin.getVar('var');

---

谢谢大家的帮助

你读过jQuery插件编写指南吗？其思想是将字符串或字符串/对象对传递给插件，让插件确定使用哪个内部方法。我不是在谈论运行内部方法，正如我在我的帖子

中所说，我实现了标准的$（）.plugin（'method'）体系结构

我是在谈论一个对象，在这个对象中，人们可以添加“plugins”来使用我自己的插件。该对象还包含用于扩展插件的实用程序函数。我可以做一些像

$（'#elm'）.Plugin（'extend'，{…}）但我不确定，这就是为什么我在这里要求获得SO的经验。我处理设置爬行的方式是为每个实例分配一个
guid
，并以名称间隔存储由
guid
键入的对象。然后，我通过
.data（）
将
guid
设置为元素。不过，我没有想过修改函数原型，这是个好建议！我对这个答案唯一不满的是，API对所有滑块都是全局的，而不是特定于一个实例。但是，如果将它放在
fn
范围内，则需要在jQuery对象上调用它，或者使用完全限定名
$.fn.Plugin
调用它。我想我会在
$
中放置一个api对象，这样就可以通过
$访问api。Plugin
和Plugin可以像
$（）。Plugin（）
一样使用。这也会起作用（当然，假设您选择了一个比“Plugin”：）更独特的名称）。