Подтвердить что ты не робот

$ 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 выше? Просто, когда я думаю, что я понял...

4b9b3361

Ответ 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 вам нужно будет использовать анонимную функцию или расширить функцию привязки в прототипе, чтобы поддерживать область видимости.