объекты JavaScript, обратный вызов и это ключевое слово

Question

Мне трудно понять, как правильно ссылаться на 'right' 'this' в обратном вызове jjery ajax.

У меня есть класс javascript, в котором я определяю обратный вызов:

Foo.prototype.onCallback = function(response) {
  // 'this' should refer to an instance of foo in both the following cases
  this.bar(...)    
  this.hello(...)
}

вне класса, который у меня есть:

foo1 = new Foo()
myCallback = foo1.onCallback;

$.ajax({
  ...
  success: function(response) {myCallback(response); ... }
});

Сейчас я считаю, что 'this' в foo1.onCallback ссылается на элемент html, к которому присоединен вызов ajax.Как мне убедиться, что «this» относится к foo1?Есть ли лучший способ сделать это?

Answer 1

Вы можете использовать context свойство $.ajax:

var foo1 = new Foo();

$.ajax({
  context: foo1,
  success: function(response) { this.onCallback(response); }
});

..., которое вызывает this в обратном вызове для ссылки на ваш объект Foo.

Answer 2

Вы не можете этого сделать.

Вы должны написать:

$.ajax({
  ...
  success: function(response) { foo1.onCallback(response); ... }
});

или это:

myCallback = foo1.onCallback.bind(foo1);

Обратите внимание, что Function.bind() требует ECMAScript 5.

Answer 3

Используйте следующую идиому:

myCallback = foo1.onCallback.bind(foo1);

Фактически вы должны воспользоваться преимуществами первоклассной поддержки функций в JavaScript еще дальше:

foo1 = new Foo()

$.ajax({
  ...
  success: foo1.myCallback.bind(foo1)
});

См. Также:

• Если Javascript имеет функции первого класса, почему это не работает?

Answer 4

Вы можете просто добавить инструкцию alert(this);, чтобы увидеть, является ли она foo1.