CODEWITHSUNDEEP
javascriptpromise
larry burns
larry burns

Reputation: 189

How are javascript promises handled in the runtime environment

I'm trying to figure out how promises are handled in the runtime environment. Are they moved into the web API container until they resolve and then pushed into the callstack when .then is called? Here is some example code. Console.log runs before the promises which leads me to believe somewhere along the way they end up in the queue. I also noticed I can put a function in a .then and the returned promise will fill that functions parameters. 

// asynchronous test
let promiseWhatever = new Promise( function(resolve, reject){

 // variable to be chained later and passed in function argument
  let chainedVariable = 'I am chained';
  resolve(chainedVariable);
  reject('rejected promise');
});

let promiseMe = function(promiseResult) {
  let message = `${promiseResult} to my computer`;
  return Promise.resolve(message); 
  // resolves here to be passed onto the second chained then
};


function hello() {


  promiseWhatever
  .then(promiseMe) 
  // how does promiseMe take in the result for its argument?

  // then returns another promise and you can chain them
  .then( function(fulfilled){
    console.log(fulfilled);
  }) // is fullfilling the code to display the string to the console.
  .catch( function(err) {
    console.log(err);
  });

  console.log('hello'); // logs first to the console

};

hello();

Upvotes: 1

Views: 1096

Answers (1)

jfriend00
jfriend00

Reputation: 707198

First off a promise is just a notification scheme. The underlying asynchronous operation (whatever code resolves or rejects the promise) that would typically be outside of Javascript (using native code) such as an incoming webSocket message or an ajax response or something like that.

All promise engines use the event queue. When a promise is resolved, they post an event to the event queue in order to trigger the appropriate .then() or .catch() handler to be called. It is not required by the language or promise specification, but a number of implementations use a special event queue for promise callbacks that is checked along with other types of event queues.

It is required by the promise specification that a .then() or .catch() handler is always called asynchronously AFTER the current event loop code has finished even if the promise is resolved immediately. That's why your console.log('hello') shows before the console.log() inside the .then() handler. This is by design and is done in order to create consistency on when a promise calls it's handlers (always after the current event loop code completes).

Are they moved into the web API container until they resolve and then pushed into the callstack when .then is called?

When a promise is resolved an event is inserted into the event queue which will cause the appropriate .then() callbacks to get called after the current event loop code has completed (on a future event loop cycle).

It's not clear what you mean by "web API container" so I can't comment on that.

I also noticed I can put a function in a .then and the returned promise will fill that functions parameters

Yes, this is how promises work. A .then() handler is passed a single argument that represents the resolved value of the promise. A .catch() handler is passed a single argument that represents the reject reason.

Upvotes: 3

Related Questions