Статьи / JavaScript / Паттерны

Chain Deferred

var chain;

chain = function () {};

chain.prototype.deferred = [];

chain.prototype.add = function (fn) {
    this.deferred.push(fn);
    return this;
}

chain.prototype.next = function () {
    if (this.deferred.length) {
        this.deferred.shift().apply(this);
    }
}

chain.prototype.start = function () {
    this.deferred.shift().apply(this);
}
/*
* создаём новый объект цепь
*/
var ch = new chain();
    ch.
    add(function(){
        setTimeout(function () {
            console.log(1);
            ch.next();
        }, 1000);
    }).
    add(function(){
            setTimeout(function () {
                console.log(2);
                ch.next();
            }, 1000);
    }).
    add(function(){
        console.log(3);
    }).
    start();

Данный паттерн позволяет вызывать функции по цепи с задержками.

Его можно использовать при написании анимации, при желании можно даже создать маленькое аниме на javascript. Этот паттерн по сути является неким timeline (временной линейкой), подобной той, которую знают flasher-ы(те, кто пишет на flash ролики)

var ch = new chain();
    ch.
    add(function(){
            Nachalo();                  //Занавес поднимается
            ch.next();
    }).
    add(function(){
            VishelMesyatsIzTumana();   //Акт первый
            ch.next();
    }).
    add(function(){
            VinulNozhikIzKarmana();   //Акт второй
            ch.next();
    }).
    add(function(){
        End();                        //Занавес опускается
    }).
    start();