Упростите вызов пользовательского плагина jQuery

Question

Я написал плагин со следующей «подписью»:

jQuery.fn.attach = function(element, settings, duration, options, callback) {

Здесь element - это объект jQuery, settings - мои пользовательские настройки для моего плагина, а duration, options и callback - все параметры, которые я использую в анимации jQuery, например:

someObject.animate({ someCSS }, duration, options, callback);

Теперь мой вопрос: возможно ли упростить вызов этой функции? Например, прямо сейчас, чтобы все работало так, как я ожидаю ... Я должен включить все параметры и установить параметры, которые я не использую, на null:

$(this).attach($('#e1-blue'), null, 3000, null, function() { alert('done'); });

Было бы неплохо, чтобы также мог назвать это как:

$(this).attach($('#e1-blue'), 3000, function() { alert('done'); });

и как это (ofc) ...

$(this).attach($('#e1-blue'), 3000);

Есть предложения?

Answer 1

Я устанавливаю объект по умолчанию и принимаю только один аргумент в функции плагина

  $.fn.myPlugin=function(opt){
    var o=$.extend({}, $.fn.myPlugin.defaults, opt||{});
  };
  $.fn.myPlugin.defaults={
    element: null,
    settings: null,
    options: null,
    callback: null,
    duration: 250
  };

Создание плагина

$('#myElement').myPlugin({element: $('#el-blue'), duration: 2000})

Если вы передаете что-то каждый раз, вы можете задать объекту параметров второй аргумент.

  $.fn.myPlugin=function(element, opt){
   return this.each(function(){
    var o=$.extend({}, $.fn.myPlugin.defaults, opt||{});
    //do some stuff
    if (o.callback) {
     o.callback.call(this, o);
    }
   });
  };

$('#myElement').myPlugin($('#el-blue'), {duration: 3000, callback: function(){}});

Answer 2

Самая простая вещь, о которой я могу подумать, это переупорядочить параметры так, чтобы наиболее часто используемые из них были на первом месте. Так что если вы измените функцию на:

jQuery.fn.attach = function(element, duration, callback, settings, options) {

тогда вы можете сделать все (кроме, вероятно, первого параметра) необязательным, поместив значения по умолчанию в тело функции. Такие как:

if(!duration)
   duration = 3000;

Тогда

$(this).attach($('#e1-blue'), 3000, function() { alert('done'); });

и

$(this).attach($('#e1-blue'), 3000);

оба будут действительны, а другие значения будут автоматически заполнены null.

Строго говоря, вы можете проверить типы параметров внутри функции, например, если вторым параметром является целое число, то это duration, если это функция callback, если это объект settings, но я не думаю, что люди, которые будут следовать вашему коду позже, будут благодарны Это. Это также может затруднить дальнейшее расширение функции, если, например, требуется второй целочисленный параметр.

Answer 3

Я предлагаю вам взглянуть на сигнатуры методов, чтобы увидеть, как люди обрабатывают необязательные аргументы. Например, посмотрите на http://gist.github.com/277432#LID5445, чтобы увидеть настройку jQuery.speed, которую jQuery.animate использует - http://gist.github.com/277432#LID5445.

В любом случае, вы просто хотите посмотреть на тип ваших аргументов, чтобы увидеть, передали ли их люди.