$ this vs $(this) в jQuery
Я видел некоторые обсуждения SO относительно $(this)
vs $this
в jQuery, и они имеют смысл для меня. (См. обсуждение здесь для примера.)
Но как насчет фрагмента ниже, из учебника плагина сайта jQuery, показывающего, как работает цепочка?
(function ($) {
$.fn.lockDimensions = function (type) {
return this.each(function () {
var $this = $(this);
if (!type || type == 'width') {
$this.width($this.width());
}
if (!type || type == 'height') {
$this.height($this.height());
}
});
};
})(jQuery);
Что означает $this
выше? Просто, когда я думаю, что я понял...
Ответы
Ответ 1
$this
- просто обычная переменная. Символ $
является допустимым символом в именах переменных, поэтому $this
действует так же, как и любое другое не зарезервированное имя переменной. Он функционально идентичен вызову переменной JellyBean
.
Ответ 2
Обычно вы используете var $this = $(this);
, чтобы избежать создания нового объекта jQuery чаще, чем это необходимо. В случае кода ниже вы создаете только один объект вместо двух/четырех. Это абсолютно не связано с цепностью.
Вы также можете назвать его that
, $thi$
или что-нибудь еще (не используйте последний, но он уродливый: p), поскольку $
является просто символом в JavaScript, точно так же, как az.
Ответ 3
this
в javascript (обычно) представляет ссылку на объект, вызывающий текущую функцию. Эта концепция несколько озадачена jQuery попытками сделать использование this
более удобным для пользователя в .each()
петля.
вне .each()
, this
представляет объект jQuery, вызываемый .lockDimensions
.
внутри .each()
он представляет текущий итерированный объект DOM.
Как правило, целью сохранения $(this)
в локальной переменной является предотвращение того, чтобы вы вызывали функцию jQuery $()
несколько раз, кеширование jQueryized this
должно помочь эффективности, если вам нужно используйте его несколько раз.
$
является просто допустимым символом имени переменной и используется как первый символ имени переменной, обычно для очереди программиста на то, что он уже является объектом jQuery (и имеет доступные методы/свойства).
Этот вопрос фактически не связан с цепной способностью, но для поддержания способности цепочки вы должны возвращать this
, чтобы другие функции могли быть добавлены и поддерживали значение this
в этих вызовах.
Ответ 4
возможно, вы пропустили эту строку:
var $this = $(this);
Здесь $this
- это просто переменная, которая содержит значение $(this)
. Вы можете использовать его взаимозаменяемо с $(this)
с тем преимуществом, что вы не выполняете тот же поиск снова и снова.
Ответ 5
$this
- это просто локальная переменная, названная так, чтобы напомнить вам о $(this)
. Он сохраняет работу по созданию версии jQuery this
, и вы можете использовать ее несколько раз.
Ответ 6
$this
- это только локальная копия this
, завернутая в jQuery.
В долгосрочной перспективе сохранение локальной копии, а не упаковки this
каждый раз, когда это необходимо, намного эффективнее.
Ответ 7
$this = $(this)
- это способ кэширования объекта jQuery. Запустить функцию jQuery очень дорого, поэтому сохранение вывода позволяет повторно использовать селектор снова и снова, не вызывая снова функцию jQuery.
Ответ 8
Он просто заполняет переменную $this
$(this)
, поэтому вам не нужно искать элемент $(this)
для каждого вызова. Он имеет лучшую производительность
var $this = $(this);
Ответ 9
$this = $(this)
что означает, что вы назначаете текущий объект переменной с именем $this
. Это не ключевое слово.
Это просто имя переменной.
Ответ 10
Это довольно просто: $this = $(this)
. Это просто сокращение, используемое в рамках внутренней функции. Знак доллара - это просто символ в этом случае, он вообще не относится к jQuery. Его также можно было бы назвать _this
или xthis
, $
- это просто напоминание о том, что содержит переменная.
Это может показаться бессмысленным, но оно устраняет три избыточных метода invocations (функция $()
не является бесплатной), поэтому она наиболее вероятно используется там по причинам производительности.
Ответ 11
Внутри $.fn.lockDimensions
, this
- это объект jQuery, на который был вызван lockDimensions
.
Внутри .each
, this
теперь ссылается на DOMElement в текущей итерации цикла. $(this)
обертывает DOMElement в объекте jQuery, а var $this = $(this);
просто сохраняет $(this)
в переменной с именем $this
, поэтому конструктор jQuery не нужно вызывать несколько раз (если вы должны использовать $(this)
).
Ответ 12
Значок $
обычно используется перед именами переменных в JavaScript, чтобы различать общее значение и объект jQuery. Итак, здесь $this
просто получает значение $(this)
, которое возвращает объект jQuery this
. $
является частью допустимого имени переменной.
Ответ 13
$this
- это переменная с именем $this
, содержащая ссылку на $(this)
. Немного бессмысленная ИМО.
Ответ 14
Я хочу перепрыгнуть сюда, хотя у меня нет экспертных навыков jQuery.
Сколько раз я вижу строки кода или понятия, похожие на:
var $this = $(this);
Итак, я переписываю его так же, как:
var $jims_this = $(this);
И протестируйте его. Также я делаю это, чтобы устранить любую путаницу, которая у меня может быть.
Вот еще один пример подобного плохо объясненного кода:
<style>
a.a { font-weight: bold; }
</style>
Затем добавьте вызов addClass к вашему script:
$("a").addClass("a");
Это работает, но это путает. Его можно было бы написать как:
<style>
a.my_bold_class { font-weight: bold; }
</style>
$("a").addClass("my_bold_class");
Джим
Ответ 15
Вы зашли в область видимости и закрытия javascript.
За короткий ответ:
this.bar()
выполняется под действием foo (как это относится к foo)
var barf = this.bar;
barf();
выполняется под глобальной областью.
this.bar в основном означает:
выполните функцию, указанную в этом файле .bar, в рамках этого (foo). Когда вы скопировали this.bar в barf и запустили barf. Javascript понимается как, запустите функцию, обозначенную barf, и поскольку этого нет, она просто запускается в глобальной области.
Чтобы исправить это, вы можете изменить
barf();
примерно так:
barf.apply(this);
Это сообщает Javascript, чтобы связать область действия этого с barf перед ее выполнением.
Для событий jquery вам нужно будет использовать анонимную функцию или расширить функцию привязки в прототипе, чтобы поддерживать область видимости.