代码之家 › 专栏 › 技术社区 › devth

jquery插件选项:必需、可选、不可访问

jquery-plugins data-structures jquery javascript

devth · 技术社区 · 14 年前

我很好奇如何为jquery插件指定一些选项,有些是必需的,有些是可选重写的,有些是不能触摸的。

我以平常的方式开始:

jQuery.fn.plugin = function (options){
  var defaults = { username: "", posts:10, api: "http://myapi.com" }
  var settings = jQuery.extend({}, defaults, options);
}

假设我想要 username 是必须的, posts 是可选的(默认为10),并且您(您是插件的用户)不能更改 api 即使他们尝试了。理想情况下,它们仍然处于相同的数据结构中,而不是被分割成不同的对象。思想?

2 回复 | 直到 14 年前

Nick Craver 14 年前

如果你想用户名是必需的,我会把它设为一个参数,因为它是唯一必需的,而且没有20个参数你想这样做。像这样的:

jQuery.fn.plugin = function (username, options){
  var defaults = { posts:10, api: "http://myapi.com" }
  var settings = jQuery.extend({}, defaults, options);
}

没有干净的 必修的 这样做的方法 完全地 在一个传递的对象中,至少不是一个简单的对象,这是api所需要的。另一种方法是指定没有默认值和警报,如果没有,我想是:

jQuery.fn.plugin = function (options){
  var defaults = { posts:10, api: "http://myapi.com" }
  var settings = jQuery.extend({}, defaults, options);
  if(typeof options.username == 'undefined') { 
    alert("You must specify a username");
    return this;
  }
}

编辑 -遗漏了一部分问题,对于不可访问的插件,要么对值进行硬编码,因为这是相同的结果,要么稍微清理一下插件中的内部对象,使其超出其他任何地方的范围。同样,在同一个对象上做同样的事情并不容易,除非你一直说 intenalDefaults 对象,并调用 jQuery.extend() 用它之后设置的扩展,以便覆盖使用者传入的任何内容。

ndp 14 年前

$.fn.plugin = function(username, options) {
  if (!username) throw "Must provide a username.";

  var config = $.extend({}, $.fn.plugin.defaults, options);

  var privateVal = 4;
  ...
}

$.fn.plugin.defaults = {
  posts: 10
}

以下是总结:

所需参数通常作为正常有序参数传递得最清楚。如果有太多这样的问题,可以考虑使用某种结构——或者更好的——一个不同的api。
选项最容易通过选项散列指定为最后一个参数。一般来说 可选择的 ,但如果它们丢失了,肯定有可能抛出错误。
使用jquery的 extend 功能。你通常会有一些“默认”来收集这些。我喜欢根据名称间距将这些范围限定为插件的名称本身,并作为可用选项的有用文档。
一般来说 throw 如果缺少必需的参数。
如果您有不希望调用者干扰的值,请在插件中定义它们,javascript的作用域将防止调用者干扰它们。