Как вызвать метод внутри объекта javascript
Я только что узнал о том, как лучше всего организовать свой код javascript, и у меня был вопрос относительно этого небольшого фрагмента кода, который я написал:
var reportsControllerIndex = {
plotMapPoints: function(data) {
//plots points
},
drawMap: function() {
$.getJSON('/reports.json', function(data) {
reportsControllerIndex.plotMapPoints(data);
});
},
run: function() {
reportsControllerIndex.drawMap();
}
};
вопрос касается вызова другой функции reportsControllerIndex из объекта reportsControllerIndex. Сначала я попробовал следующий фрагмент кода для функции run:
run: function() {
this.drawMap();
}
, которые прекрасно работали. Тем не менее, я быстро нашел это для drawMap функция:
drawMap: function() {
$.getJSON('/reports.json', function(data) {
this.plotMapPoints(data);
});
}
не работает, так как "это" теперь будет ссылаться на функцию обратного вызова вызова getJSON.
мое решение состояло в том, чтобы просто разместить reportsControllerIndex перед всеми методами, которые я хочу вызвать, но мне было любопытно: есть ли более относительный способ вызова функций в общем объекте, как это (так же, как вы сделали бы с классом на стандартном языке OO)? Или я вынужден делать это так, как я сейчас, просто вызывая методы через имя объекта?
5 ответов
вы хотите сохранить this
привязка в переменной.
drawMap: function() {
var _this = this;
$.getJSON('/reports.json', function(data) {
_this.plotMapPoints(data);
});
}
поздний ответ, но jQuery есть метод под названием jQuery.proxy()
это сделано для этой цели. Вы передаете ему функцию вместе со значением this
вы хотите сохранить, и он вернет функцию, которая гарантирует this
является правильным.
таким образом, вам не нужно определить переменную.
drawMap: function() {
$.getJSON('/reports.json', $.proxy(function(data) {
this.plotMapPoints(data);
}, this));
}
plotMapPoints: function(data) {
//plots points
}.bind(this)
при определении функции вы можете просто добавить .bind (this), чтобы установить правильный контекст для этой функции.
вы можете написать это нравится:
var reportsControllerIndex = new function () {
var self = this;
self.plotMapPoints = function (data) {
//plots points
},
self.drawMap = function () {
$.getJSON('/reports.json', function (data) {
self.plotMapPoints(data);
});
},
self.run = function () {
self.drawMap();
}
};
этот класс будет работать так же, как и вы, и вы все равно можете вызвать метод класса по:
reportsControllerIndex.run()
в этой парадигме, я определил self
указывает на сам класс, так что вы можете называть self
везде, где вы хотите в классе.
далее, эта парадигма может решить this
проблема в функции, которую вы приносите в качестве обратного вызова другому funciton:
plotMapPoints: function(data) {
console.log(this);
// Need a this referring to the class itself
// It's inconvenient to bring this as parameter
},