Должен ли я передать объект JQuery или DOM в качестве аргументов?(Вопрос производительности) - PullRequest
Новая
       36

Должен ли я передать объект JQuery или DOM в качестве аргументов?(Вопрос производительности)

9 голосов
/ 24 сентября 2011

Что лучше с точки зрения производительности. 

foo(this);

function foo(element) {

    $(element).index();

}

Или я должен сделать 

foo($(this));

function foo($element) {

    $element.index();

}

Очевидно, принимая во внимание, что я буду использовать аргумент довольно много раз внутри функции.

Спасибо!Connor

Ответы [ 3 ]

9 голосов
/ 24 сентября 2011

Неважно, где вы оберните объект в jQuery, если вы собираетесь обернуть его в любом случае.

Имеет значение только то, что вы кэшируете результат переноса и не переносите его дважды.

В этом отношении следующие правила применяются ко многим кодам плагинов:

1)Все переменные jQuery имеют префикс $: var $this = $(this)

2) никогда не переносить переменную с префиксом $ в $

3) всегда кэшировать (сохранять в var) любое выражение в jQuery, используемое болееодин раз

4) если один и тот же обернутый объект (например, var $items = $('ul li');) встречается более одного раза в нескольких похожих функциях, переместите его во внешнюю область и положитесь на замыкание.

8 голосов
/ 24 сентября 2011

Если вы пишете функцию, которая будет принимать один объект jQuery в качестве параметра, вам действительно следует вместо этого написать его как плагин jQuery. 

jQuery.fn.yourFunction = function(otherArg1, otherArg2, ...) {
  // ...
};

Тогда вместо записи 

yourFunction($(whatever));

вы можете написать 

$(whatever).yourFunction().someOtherJQueryFunction();

Внутри функции значением this будет сам объект jQuery.Шаблон для использования с большинством общих функций, связанных с DOM: 

jQuery.fn.yourFunction = function(otherArg1, otherArg2, ...) {
  return this.each(function() {
    var $element = $(this);
    // do stuff ...
  });
};

Обратите внимание, что на внешнем уровне функции this не заключен в $(this), поскольку он уже гарантированно является jQuery.объект.Дело обстоит не так в теле функции "each ()" или чего-либо подобного.

3 голосов
/ 24 сентября 2011

Если вы намереваетесь передать в функцию только один элемент, это не имеет значения.Я бы разработал параметр функции в зависимости от того, что мне, вероятно, уже пригодилось во время вызова.Если бы я никогда не имел его в объекте jQuery уже во время вызова, то я бы просто передал элемент DOM и позволил функции превратить его в объект jQuery (если это необходимо).Если он всегда был у меня в объекте jQuery, то будет лучше передать тот объект, который у меня уже есть, чем дополнительный элемент DOM, а затем превратить его в другой объект jQuery внутри функции.

Если вынамеревается передать несколько элементов в функцию, тогда, вероятно, проще просто передать объект jQuery, потому что это хорошая удобная оболочка для нескольких объектов.

Как сказал Пойнти, самое элегантное решение - сделать вашу функциюи затем он автоматически примет множество различных аргументов, включая селектор, элемент DOM, массив элементов DOM или объект jQuery (все это обрабатывается инфраструктурой jQuery для вас).

Вы достигнете наилучшей производительностиесли вы только один раз превращаете элемент DOM в объект jQuery.Передача DOM или объекта jQuery в качестве аргумента будет иметь одинаковую производительность (оба передают ссылку на объект).Идея плагина на самом деле будет иметь немного худшую производительность, потому что она имеет универсальное назначение и принимает множество различных аргументов и, следовательно, должна определять тип передаваемого аргумента.Эта разница в производительности, возможно, не заметна по сравнению со временем, которое занимает метод .index().

...