Использование Обещания в приложении qooxdoo

Question

В классе qooxdoo, у меня есть набор асинхронных методов, которые должны быть соединены (сериализованным):

main: function() { 
    async1(); 
}, 

async1: function() { 
    var json = new qx.data.store.Json("http://..."); 
    json.addListener("loaded", function(event) { 
     ... 
     async2(); 
    }); 
}, 

async2: function() { 
    // similar to async1 
} 

Поскольку число шагов растет, цепь становится трудно trace, и код становится нечитаемым. Что мы можем сделать, это переписать код с помощью Promises:

main: function() { 
    new Promise(this.async1) 
    .then(function() { 
     return new Promise(this.async2); 
    }).then(function() { 
     return new Promise(this.async3); 
    }).catch(...); 
}, 

async1: function(resolve, reject) { 
    var json = new qx.data.store.Json("http://..."); 
    json.addListener("loaded", function(event) { 
     ... 
     resolve(); 
    }); 
}, 

async2: function(resolve, reject) { 
    // similar to async1 
} 

Это прекрасно работает, но только до тех пор, пока добавить некоторую реальную логику. Помните, что это класс qooxdoo с большим количеством материалов, инкапсулированных в this. Но вдруг оказывается, что оба метода async * и анонимные функции, используемые в then() и catch(), имеют свой this контекст, привязанный к window, глобальному объекту. Для того, чтобы иметь возможность использовать фактические this, мы можем выполнить пересвязывание:

main: function() { 
    new Promise(this.async1.bind(this)) 
    .then(function() { 
     this.doSomeStuff(); 
     return new Promise(this.async2.bind(this)); 
    }.bind(this)).then(function() { 
     return new Promise(this.async3.bind(this)); 
    }.bind(this)).then(function() { 
     this.doSomeFinalStuff(); 
    }.bind(this)).catch(function() { 
     this.doStuffOnError(); 
    }.bind(this)); 
}, 

async1: function(resolve, reject) { 
    this.doOtherStuff(); 
    var json = new qx.data.store.Json("http://..."); 
    json.addListener("loaded", function(event) { 
     ... 
     resolve(); 
    }); 
} 

Это, наконец, работает, но Doh, некрасиво это код! Есть ли способы избавиться от этих ручных привязок? Почему не неявно связаны при ссылке this.async1, метод экземпляра?

Answer 1

Проверить this answer out

В принципе, это не выглядит, как вы» делать что-то неправильно в корне. Вот как должен работать этот контекст. Вам действительно нужен какой-то синтаксический сахар для вашего конкретного случая использования. Вы можете сделать эти расширения сахара самостоятельно или использовать библиотеку, чтобы сделать тяжелый подъем.

Вы также можете перестроить свой код, как это предлагает Danbopes, и организовать его, чтобы вы делали меньше встроенных привязок. Это позволит вам лучше читать поток.

Answer 2

Если добавить var self = this; в верхней части, в пределах всех функций, вы можете обратиться к самому объекту, вызывающему себя:

main: function() { 
    var self = this; 
    new Promise(self.async1) 
    .then(function() { 
     return new Promise(self.async2); 
    }).then(function() { 
     return new Promise(self.async3); 
    }).catch(...); 
},