Javascript «это» ссылка - Может кто-нибудь объяснить простой пример? - PullRequest
0 голосов
/ 01 марта 2012

Я погружаюсь в JavaScript и пытаюсь понять ссылки «this» в реальном коде. Может ли кто-нибудь объяснить ссылку «это» в следующем примере?

$('#myimage').mouseenter(function() {
    $(this).effect('bounce',500);
});​

Я понимаю, что ключевое слово "this" относится к тому, что "владеет" функцией объявления. Это означает, что в следующем коде «this» будет ссылаться на объект, который возвращается функцией objectFunction:

var objectFunction = function() 
    {
        var thing = function() { alert(this.toString());  };

        return { thing : thing };
    }
objectFunction().thing();

Теперь в первом коде ключевое слово this фактически ссылается на элемент DOM myimage. Что я не могу понять, так это то, как я могу определить это путем проверки JavaScript. Может кто-нибудь объяснить это?

Ответы [ 2 ]

3 голосов
/ 01 марта 2012

Событие в вашем примере обрабатывается jQuery, а не движком Javascript. В Javascript можно установить, на что ссылается «this» при вызове функции. Для этого jQuery использует метод .apply в функции. Поэтому, когда jQuery интерпретирует селектор, он будет вызывать вашу функцию-обработчик для каждого сопоставленного объекта, устанавливая this для этого сопоставленного объекта. Э.Г.

var handler = function() { alert(this.id) }

handler.apply(document.getElementById('something'));

В приведенном выше примере «this» внутри обработчика будет ссылаться на элемент dom с id «что-то», а в предупреждении будет показан текст «что-то».

0 голосов
/ 01 марта 2012

В вашем примере анонимная функция является обработчиком событий. Ключевое слово this будет ссылаться на любой элемент, вызвавший событие. В этом случае это может быть только элемент с идентификатором myimage, поскольку событие связано только с этим элементом. Это не обязательный случай; рассмотрим следующий вариант:

$('img').mouseenter(function() {
    $(this).effect('bounce',500);
});​

Этот код будет прикреплять обработчик события ввода мыши ко всем тегам изображения в документе. Таким образом, this потенциально может ссылаться на любое изображение в документе; это зависит от того, какое изображение было «затронуто» курсором мыши.

...