Jascript Promise Implementation Practice

by hugogo7646

HTML

<div>Log:</div>
<div id="log"></div>

JavaScript

function MyPromise(callbackFunc){
  var promise = this;
  
  promise.status = "pending"; //pending, resolved
  promise.callbackQueue = [];
  promise.resolvedData = null;
  
  promise.addCallbackFuncToQueue = function(callbackFunc){
  	promise.callbackQueue.push(callbackFunc);
    if (promise.status == "resolved"){
    	promise.fireCallbackFuncInQueue();
    }
  }

  promise.resolve = function(resolvedData){
  	if (promise.status != "resolved"){
      promise.resolvedData = resolvedData;
      promise.status = "resolved";
      promise.fireCallbackFuncInQueue();
    }
  }
  
  promise.fireCallbackFuncInQueue = function(){
    while(promise.callbackQueue.length > 0){
      var callbackFuncToFire = promise.callbackQueue.shift();
      callbackFuncToFire.call(promise, promise.resolvedData);
    }
  }
  
  promise.then = function(thenCallbackFunc){
  	return new MyPromise(function(resolve){
    	promise.addCallbackFuncToQueue(function(data){
      	var returnedPromiseFromThenCallbackFunc = thenCallbackFunc.call(promise, data);
        returnedPromiseFromThenCallbackFunc.addCallbackFuncToQueue(resolve);
      });
    });
  }

  callbackFunc.call(promise, this.resolve);
}
/////////////////////////////////////////////////
var logDom = document.getElementById("log");
new MyPromise(function(resolve){
	var data = 1;
	console.log(data); 
  logDom.innerHTML = logDom.innerHTML + "<br/>" + data;
  setTimeout(function(){
  	resolve(2);
  }, 2000);
})
.then(function(data){	
  return new MyPromise(function(resolve){
		console.log(data); 
  	logDom.innerHTML = logDom.innerHTML + "<br/>" + data;
  	setTimeout(function(){
  	resolve(3);
  }, 1000);
  });
})
.then(function(data){	
  return new MyPromise(function(resolve){
    console.log(data); 
    logDom.innerHTML = logDom.innerHTML + "<br/>" + data;
  	resolve();
  });
});