Preface

Before you read, I hope you should have some hand-on experience of the Promise mechenism in javascript. And you should also bear in mind that Promise is not mysterious at all, which is just a trick invented by some functional programming enthusiast. In the following part, I will unmask the magic of this magic Promise

Anatomy

Recap

Let’s coin a simple promise example first

function getUserId() {
    return new Promise(function(resolve){
        http.get(url, function(results){
            resolve(results.id);
        })
    });
}

getUserId().then(function(id){
   //Processing given id from resolve; 
});

Prototype for Promise

function Promise(fn) {
    var state = 'pending';
    var value = null;
    var callbacks = [];
    
    //'then' is a register for callbacks function 
    this.then = function (onFulfilled, onRejected){
        return new Promise(function(resolve, reject){
            handle({
                onFulfilled: onFulfilled || null,
                onRejected: onRejected || null,
                resolve: resolve,
                reject: reject
            });
        });
    };
    
    function handle(callback){
        if (state == 'pending'){
            callbacks.push(callback);
            return;
        }
        
        var cb = (state === 'fulfilled' ? callback.onFulfilled: callback.onRejected);
        
        if (cb === null) {
            cb = (state === 'fulfilled' ? callback.resolve : callback.reject);
            cb(value);
            return;
        }
        
        try {
        	var ret = cb(value);
        	callback.resolve(ret);
    	} catch (e) {
        	callback.reject(e);
    	} 

                                       r
    }
    
    
    function resolve(newValue){
        if (newValue && (typeof newValue === 'object' || typeof newValue === 'function')) {
            var then = newValue.then;
            if (typeof then === 'function') {
                then.call(newValue, resolve);
                return;
            }
        }
        value = newValue;
        state = 'fulfilled';
        execute();
    };
    
    function reject(reason) {
        state = 'rejected';
        value = reason;
        execute();
    }
    
    
    function execute(){
        setTimeout(function() {
            callbacks.forEach(function (callback){
            	callback(value);
        	});
        }, 0);
    }
    
    //Start the real function call
    fn(resolve, reject);
}