/ / Виконайте кілька Обіцянь JavaScript за допомогою бібліотеки Promise RSVP.js - javascript, promis, rsvp.js

Запуск декількох обіцянок JavaScript з бібліотекою обіцянок RSVP.js - javascript, promise, rsvp.js

Простий демонстраційний код JavaScript нижче використовує бібліотеку обіцянок RSVP.js https://github.com/tildeio/rsvp.js/ щоб завантажити деякі дані JSON за допомогою AJAX і після завершення видаляє деякий код після завантаження всіх даних JSON.

Я хочу розширити його, щоб зробити ще кілька обіцянок після завантаження даних JSON, які не є запитами AJAX.

Наприклад, після завантаження даних JSON, я хочу створити ще одне Обіцяння, яке запустить функцію, яка встановить деякі обробники / слухачі подій DOM.

Після функції, яка встановлює обробку подій, я хотів би запустити якусь іншу функцію після завершення налаштування подій.

Я дуже новий і навчаюсь Обіцянки все ще, а в деяких випадках все ще вивчаю JavaScript, щоб я міг скористатись допомогою. Приклад коду, що розширює міну внизу та на JSFIddle, буде дуже вдячний!

Я вважаю, що якщо мені покажуть, як додати ще одну обіцянку до моєї демонстрації, тоді мені буде достатньо додати стільки, скільки мені потрібно в остаточному додатку.

JSFIddle Демо код нижче: http://jsfiddle.net/jasondavis/fttzoggj/


var jsonPromiseCache = {};



// AJAX function to load JSON data using Promise()
var getJsonDataPromise = function(url, key) {

if (!jsonPromiseCache[key]) {
jsonPromiseCache[key] = new RSVP.Promise(function(resolve, reject){
// If jsonPromiseCached data is not set then make AJAX requiest to get it


var client = new XMLHttpRequest();
client.open("GET", url);
client.onreadystatechange = handler;
client.responseType = "json";
client.setRequestHeader("Accept", "application/json");
client.send();

console.log("---- "client" XMLHttpRequest/AJAX  variable ======= ",client);


function handler() {
if (this.readyState === this.DONE) {
// On AJAX success, resolve() our Promise() and set result to cached variable
// to avoid duplicate AJAX requests for this jsonCache[key] Data where "key"
// is used to assign to each AJAX endpoint URL/request of JSON data...
// (milestones, tasks, users, etc...)
if (this.status === 200) {
jsonPromiseCache[key] = this.response;

console.log("---- jsonPromiseCache["+key+"] ====== ",jsonPromiseCache[key]);

// Resolve() the Promise() on AJAX success
resolve(this.response);

// On AJAX failure, reject() our Promise()
}else{
reject(this);
}
}
};

// If JSON data for this key is already jsonPromiseCached, then return the jsonPromiseCached version
// instead of making a new AJAX request!
});
}
return jsonPromiseCache[key];
};

// EXAMPLE USAGE DEMO
// usage loading JSON data with AJAX using Promises
var promises = {
users: getJsonDataPromise("/echo/json/", "users"),
task: getJsonDataPromise("/echo/json/", "task")
};


RSVP.hash(promises)
.then(function(results) {
console.log("then() function ran on success of loading JSON data");
console.log(results);
console.log("results.users", results.users); // print the users JSON results
console.log("results.task", results.task); // print the task JSON results

// I want to create another Promise here which will run a function that creates a bunch of DOM Event handlers/listeners and in that function when it is done loading it should fire a success like the above does when JSON data is done loading
})
.finally(function(){
console.log("finally() function ran on success and failure.... It is always ran!");
})
.catch(function(reason){
console.log("[ERROR] REASON:",reason.statusText); //if any of the promises fails.
});

введіть опис зображення тут


UPDATE

Я оновив тут демонстрацію JSFiddle http://jsfiddle.net/jasondavis/fttzoggj/2 додавши нову функцію initDomEvents () та додавши її до тодішнього (initDomEvents) виклику. У моїй консолі показано, що все запускається так, як я цього хочу, однак чомусь зараз, моя помилка спрацьовує

Відповіді:

1 для відповіді № 1

Моя консоль показує, що все запускається так, як я цього хочу, але чомусь зараз, моя помилка спрацьовує

Немає жодних resolve і reject функцій у вашому initDomEvents функція. Вони наводяться як аргументи до new RSVP.Promise(…) лише зворотний дзвінок. При спробі їх зателефонувати видає помилку, яка потрапляє та розповсюджується на ваш обробник помилок (але це не має .statusText майно, так тільки undefined друкується).

Як я вже говорив у коментарях, якщо ваша функція не робить нічого асинхронного, не потрібно повертати обіцянку. Ви просто return значення або throw виняток також із зворотного дзвінка з обіцянками.
Якщо ви наполягаєте на створенні обіцянок щодо результатів чи відхилень, можете скористатися цим RSVP.Promise.resolve(…) або RSVP.Promise.reject(…) функції для створення виконаних / відхилених об'єктів обіцянки.


0 для відповіді № 2

Будь-яка конкретна причина, чому ви "використовуєте RSVP? I", переходите на jQuery Promises.

var d = $.Deferred;

$.ajax({
url: url,
cache: true,
dataType: "json",
success: function(data){
d.resolve(data);
},
error: function(error){
d.reject();
}
});

$.when(d).then(function(data){
//handle
});