How to Chain JavaScript Promises – Intro Tutorial to JavaScript Promises

What are JavaScript promises?

In it’s new ECMA 6 version, JavaScript allows you to create a new type of object called a Promise. Promises are used for asynchronous or deferred computations, and can be an alternative to the usual callback approach.

Promises can be used both on the browser (support is still not universal but it’s getting there) or in Node.js apps.

Promises can either resolve or get rejected. Inside of a promise, you are free to call the “resolve” and “reject” method whenever you see fit.

Example of a promise:

What’s wrong with using just callbacks?

Nothing, but there are times (specially on Node.js apps) when you are performing multiple operations and you need to wait for the result of one in order to move to the next. In these cases you enter what’s called the “callback hell”, when you have several callbacks inside of other callbacks.

For example, you need to do the following: read a MongoDB collection, call an external API, call some other API, save some data in MongoDB. In each step you need the result of the previous step. Using callbacks can make your code very messy.

This is an example when using JavaScript promises and chaining them together would make things easier

How do you chain JavaScript promises?

The following example shows how you can chain JavaScript native promises using the then keyword.

Imagine you have three methods that do asynchronous operations (example: Ajax calls, calls to API, Mongo operations, writing to disk, etc). You want to call “secondMethod” when “firstMethod” completes, and when “secondMethod” completes you then want to call “thirdMethod”.

See how easy this becomes with promises:

Learn JavaScript ES6 online at your own pace

Check out the online course Learn JavaScript ES6 on Zenva Academy for more information.

Published by

Pablo Farias Navarro

Pablo is a web + mobile app developer and entrepreneur. Pablo is the founder of ZENVA. Besides teaching online how to create games, apps and websites to over 85,000 students, Pablo has created content for companies such as Amazon and Intel.ZENVA runs four development communities featuring game, web and mobile app development tutorials: Zenva Academy, GameDev Academy, HTML5 Hive (also known as "the hive"), and for Spanish speakers, De Idea A App.Pablo holds a Master in Information Technology (Management) degree from the University of Queensland (Australia) and a Master of Science in Engineering degree from the Catholic University of Chile. Specialized in web, mobile application and game development.

Share this article

  • What does it mean “chain”? Is it executing parallel or one thing after another?

  • David Morcillo Muñoz

    Promises are resolved sequentially so you can get a calculated value from one promise to the next :). If you are interested on a parallel execution I recommend you the async library (

  • David Morcillo Muñoz

    Promises are resolved sequentially so you can get a calculated value from one promise to the next :). If you are interested on a parallel execution I recommend you the async library

  • Ruan Rocha

    What if I want to pass an object between the chained functions?

  • That is exactly what I’m doing in this example. When you resolve a promise (“resolve({data: ‘123’});”) you are passing that object onto the next promise in the chain.

  • xeno

    How could I not see it? I guess my head was a bit confused about all the messy Promise tutorials out there. Yours is nice, clean and straight. Great article!

  • Matt Thomas

    Nice, succinct example that took me far too long to find. This need to exemplified on high profile sites like or Nice work!

  • Thanks Matt for your comment! Glad to hear you liked the explanation. I found it extremely difficult to find a simple and plain explanation myself, so when it made sense to me, I rushed to write this short tut.

  • Sonya Panich

    I am a beginner, and am curious about how to add more methods to this chain. The confusion I am having right now is what to put into resolve, as well as where the someStuff is coming from. Thank you for your help!

  • When you resolve a method, you can optionally pass a parameter that will go into the next method – the way we retrieve this parameter in that next method in the example was the “someStuff” variable. If your methods don’t need to pass values to each other, you don’t have to enter any parameter there. Hope that helps!

  • Irgendwo

    Thank you for this great example. Finally I got it with your help. I struggled a little bit with promises until now. Just one doubt. How can I access after the promise-chain has completed the object data,newdata or result from your example?

    I tried like this to get for example result from first promise:

    console.log(JSON.stringify(data, null, 4));

  • Thanks for the comments! You can always declare a variable on a higher scope, and store it there so it’s accessible afterwards:

    var myData;

    //inside of firstMethod you assign a valud to myData
    .then(function() {

    //myData can be accessed here, because it’s on a higher scope