Question

从jQuery boilerplate site开始，我想出了一个看起来像这样的插件：

;(function($, window, document, undefined){
  "use strict"; 

  var defaults = {
        abc: 1,
        def: 'xyz'        
      };

  function Plugin(element, options){
    this.options = $.extend({}, defaults, options, element.dataset);
    this.element = element;
  }

  plugin.prototype = {
     goTo: function(where){
       // ...
     },

     close: function(){
       $(this.element).removeData('_myplug');   
     }
  };

  $.fn.myPlugin = function(options){
    return this.each(function(){
      if(!$.data(this, '_myplug'))
        $.data(this, '_myplug', new Plugin(this, options));

      if($.isPlainObject(options))
        return;

      // here how to check if 'options' matches one of the
      // functions, then call it with the rest of the variables
    });
  };

})(jQuery, window, document);

所以它可以像

一样使用

$('.stuff').myPlugin({abc: 5});

我怎样才能允许调用公共方法，如：

$('.stuff').myPlugin('goTo', 'top');
// should call instance.goTo('top');

或者：

$('.stuff').myPlugin('close');
// should call instance.close();

我知道可以在$ .fn.myPlugin函数声明中添加更多变量，然后使用if语句检查options是否为字符串，但我想知道是否有更好的方法来执行此操作

例如，在PHP中它看起来像这样：

$args = func_get_args();
$arg1 = array_shift($args);
return call_user_func_array(array($this, $arg1), $args);

我怎样才能在javascript中执行此操作？

Answer 1

以下简要说明如何做到这一点：

var instance = $.data(this, '_myplug');
if (typeof options === "string" && typeof instance[options] === "function") {
    instance[options].apply(instance, arguments.slice(1));
}

<强>释

首先，检查options是否为字符串，以及您的实例是否包含名称为options的方法。

然后使用arguments数组。您可以从任何函数内部访问此数组，它包含调用函数时传递的所有参数（无论这些参数是否是函数定义的一部分）。

最后，您可以使用function.apply()方法将arguments数组的修改版本（除第一个之外的所有参数）传递给实例的方法。

javascript函数的多个参数类型

1 个答案: