Класс Mootools, обработка json / функция не определена

Question

Если вы видите здесь что-то, что, по вашему мнению, может быть улучшено, пожалуйста, дайте мне знать!

Проблема: я пытаюсь создать базовую структуру обработки некоторых данных Json через класс mootools. В настоящее время я сталкиваюсь с тем, что когда я вызываю this.processObj, я получаю, processObj не определен *

Код:

this.runSomeJson= new Class({

    Implements: [Options, Events],

    options: {
        contentInfo: false,
    },
    initialize: function(element, options) {
        this.element = document.id(element);
        if (!this.element) return;
        this.setOptions(options);
        this.setBasicInfo();
    },
    setBasicInfo: function () {
        var callThis = 'somegenericurl';
        this.getObj(callThis);
    },
    getObj: function (callThis) {
        var jsonReq = new Request.JSON({
          method: 'get',
          url: callThis,
          onRequest: function () {
            console.log('Loading: ' + callThis);
          },
          onComplete: function(thisObj){
            //console.log(thisObj);
            this.processObj(thisObj);
          }
        }).send();  
    },
    processObj: function (thisObj) {
        console.log('in process..');
    },
});

Answer 1

связывание this в onComplete запроса - это сам экземпляр запроса, а не ваша исходная область.

Вы можете использовать 3 модели.

1. сохранение ссылки

getObj: function (callThis) {
    var self = this;
    new Request.JSON({
      method: 'get',
      url: callThis,
      onRequest: function () {
        console.log('Loading: ' + callThis);
      },
      onComplete: function(thisObj){
        // call it on the self reference
        self.processObj(thisObj);
      }
    }).send();  
},

2. привязка анонимной функции

Вы можете использовать декоратор function.bind для изменения области внутри обратного вызова:

getObj: function (callThis) {
    new Request.JSON({
      method: 'get',
      url: callThis,
      onRequest: function () {
        console.log('Loading: ' + callThis);
      },
      onComplete: function(thisObj){
        //console.log(thisObj);
        this.processObj(thisObj);
      }.bind(this) // change scope, inner this becomes the outer this as well.
    }).send();  
},

3. перейти к методу класса и связать напрямую

это пропускает создание функции anon.

getObj: function (callThis) {
    new Request.JSON({
      method: 'get',
      url: callThis,
      onRequest: function () {
        console.log('Loading: ' + callThis);
      },
      onComplete: this.processObj.bind(this)          
    }).send();  
},

с точки зрения предпочтения: я бы выбрал # 1, так как он имеет наименьшую нагрузочную способность, это предпочтительный способ mootools [tm]. тогда, вероятно, № 3 за лучшую организацию кода.

есть 4-й способ в сочетании с мутатором класса binds из mootools-more, но давайте не будем этого делать:)