Хорошо, седло ковбоев, потому что это будет долго. Я провел утро, просматривая мой старый код, и меня интересуют лучшие практики и оптимизация. Во избежание переезда на субъективную полосу, я просто опубликую несколько примеров с некоторыми, надеюсь, простыми вопросами. Я постараюсь сделать примеры очень простыми для простоты ответа и уменьшения вероятности ошибок. Вот так:

1) Назначение против вызовов jQuery

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

$('div#apples').hide();
$('div#apples').show();

против

var oranges = $('div#oranges');
oranges.show();
oranges.hide();

Применяется ли это правило при обращении к jQuery?$(this)? Ex. Простой скрипт, чтобы сделать некоторые данные в таблице кликабельными и настроить ссылку.

$('tr td').each( function() {
    var colNum = $(this).index();
    var rowNum = $(this).parent().index();
    $(this).wrap('<a href="example.com/hello.html?column=' + colNum + '&row=' + rowNum +'">'); 
})

против

$('tr td').each( function() {
    var self = $(this);
    var colNum = self.index()
    var rowNum = self.parent().index()
    self.wrap('<a href="example.com/hello.html?column=' + colNum + '&row=' + rowNum +'">'); 
});

2)this против$(this)

Хорошо, так что это следующий вопрос, о котором я долго размышлял, но я не могу найти какую-либо информацию об этом. Пожалуйста, извините мое невежество. Когда имеет смысл называть ваниль JSthis в отличие от JQuery завернутый$(this)? Это мойпонимание тот -

$('button').click(function() {
  alert('Button clicked: ' + $(this).attr('id'));
});

Это гораздо менее эффективно, чем доступ к атрибуту DOM ванилиthis объект как следующий -

$('button').click(function() {
  alert('Button clicked: ' + this.id);
});

Я понимаю, что там происходит, мне просто интересно, есть ли эмпирическое правило, которому нужно следовать при принятии решения, что использовать.

3) Всегда ли лучше конкретность?

Это довольно просто, всегда ли полезно быть более конкретным с нашими селекторами? Это легко увидеть$('.rowStripeClass') будет намного медленнее, чем$('#tableDiv.rowStripeClass'), но где мы проводим черту? Является$('body div#tableDiv table tbody tr.rowStripeClass') еще быстрее? Любой вклад будет оценен!

Если вы сделали это далеко, спасибо, что взглянули! Если нет, то: p