Использование метода объекта в качестве прослушивателя событий - PullRequest
Новая
       12

Использование метода объекта в качестве прослушивателя событий

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

Я парень на C ++, только изучающий JavaScript, поэтому тот факт, что this связан с вызывающим объектом, продолжает удивлять. Я хочу использовать объектный метод в качестве прослушивателя событий и хочу убедиться, что я делаю это со всеми вашими профессионалами JavaScript.

Итак, чтобы метод имел его объекты «this», чтобы я мог обращаться к его свойствам в соответствующем контексте, я написал следующее: 

var user =
{
    status: 1,      // login status: 0:invalid password, 1:logged out, 2:logged in
loginName: "",

// Method called whenever the user submits a username/password via html form:
onLoginSubmit: function (event)
{
        if (this != user)   // called from 'form submit' callback, so call ourselves:
    {
        user.onLoginSubmit(event);
        return;
    }
}
};

Я нашел предыдущий ответ здесь: Доступ к свойству объекта из вызова слушателя событий в Javascript , но предлагаемое решение заключается в создании глобального. Есть ли круче, более профессиональный способ получить «это», чем предыдущее решение или мое рекурсивное решение?

Ответы [ 2 ]

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

Я предполагаю, что когда вы связываете обработчик отправки, вы делаете что-то вроде этого: 

form.submit(user.onLoginSubmit);

Хотя то, что у вас работает, лучший способ сделать это - связать обработчик отправки так, чтобы он фактически вызывал onLoginSubmit с надлежащим «this», чтобы вам не требовалась дополнительная логика в обработчике отправки. .

Если вы делаете что-то подобное при связывании функции, она должна работать. 

form.submit(function(e) {
  user.onLoginSubmit(e);
});

Используя анонимную функцию, вы все равно можете правильно вызывать метод объекта пользователя.

Если я неправильно понимаю вашу проблему, пожалуйста, опубликуйте немного кода о том, как вы вызываете onLoginSubmit ().

0 голосов
/ 01 сентября 2011

Вы можете использовать замыкания, это должно сработать: 

function User() {

  var that = this;
  this.status = 1;
  this.loginName = "";
  this.onLoginSubmit = function (event)
  {
     // the variable "that" is available and references the User instance
  }
}
var user = new User();

Здесь мы используем User в качестве конструктора, поэтому это указывает на объект, создаваемый с помощью «new».Что происходит (примерно), так это то, что переменная «this» является локальной для функции User, но поскольку функция ссылается на нее, она остается в памяти и доступна для этой функции.Затем вы можете использовать «то» вместо «это» в качестве «поддельной» области действия.

Это не то, что вы хотели бы использовать, если у вас много экземпляров User, потому что функциисоздан для каждого экземпляра.«Обычный» способ - использовать анонимную функцию, как в ответе Логана.

Большинство (если не все) фреймворки имеют элегантные способы для обработки этого, но в основном вам нужно либо иметь доступную область видимости в самой функции через замыкание, либо знать ее при вызове функции, чтобы вы могли это сделатьс правильной областью действия (написав user.onLoginSubmit ())

Надеюсь, что это вроде как ясно:)

edit: о, хорошо, кто-то опубликовал то же самое в сообщении, которое вы связали.Что ж, теперь вы настроили его на пользователя!

...