JSFiddle - React, Tailwind, and code Playground

by Boban Stojanovski

JavaScript

function asyncOper1(valueDfd) {
    return $.when(valueDfd).pipe(function (value) {
        var dfd = new $.Deferred();
        setTimeout(function () {
            dfd.resolve("One second has passed since " + value);
        }, 1000);
        return dfd.promise();
    });
}

function asyncOper2(valueDfd) {
    return $.when(valueDfd).pipe(function (value) {
        var dfd = new $.Deferred();
        setTimeout(function () {
            dfd.resolve("Two seconds were added, then " + value);
        }, 2000);
        return dfd.promise();
    });
}

function asyncOper3(valueDfd) {
    return $.when(valueDfd).pipe(function (value) {
        var dfd = new $.Deferred();
        setTimeout(function () {
            dfd.resolve("A long time (3 seconds) went by before " + value);
        }, 3000);
        return dfd.promise();
    });
}

function alertResult(valueDfd) {
    $.when(valueDfd).done(function (value) {
        alert(value);
    });
}

var res1, res2, res3;

res1 = asyncOper1("we started");
res2 = asyncOper2(res1);
res3 = asyncOper3(res2);

alertResult(res3);