Join egghead, unlock knowledge.

Want more egghead?

This lesson is for members. Join us? Get access to all 3,000+ tutorials + a community with expert developers around the world.

Unlock This Lesson
Become a member
to unlock all features

Level Up!

Access all courses & lessons on egghead today and lock-in your price for life.


    Promise Fundamentals using TypeScript

    Basarat Ali SyedBasarat Ali Syed

    Learn the fundamentals of creating, resolving and rejecting promises using TypeScript. We also cover the fundamentals of a .then chain.

    We will see how the Promise constructor takes an executor callback which will be called at runtime with two arguments (resolve and reject).



    Become a Member to view code

    You must be a Member to view code

    Access all courses and lessons, track your progress, gain confidence and expertise.

    Become a Member
    and unlock code for this lesson




    Instructor: At the heart of asyncawait, is a promise chain. To create a promise chain, we start off by creating a promise using the promise constructor. The promise constructor takes one generic type for its resolved value. Let's use a number type for now. The constructor takes an executive call back which will be called by the run time with two arguments.

    The first argument is the resolved function that can be used to resolve the promise. The second argument is the reject function that can be used to reject the promise.

    There are two fates of a promise, resolved or rejected. Promises have two member functions, then and catch that are invoked depending upon the fate of the promise.

    If we resolve a promise, any then call backs associated with the promise are called. For example, if we resolve to the number 123, we will see the then call back getting called. If we reject a promise, then any catch call backs are executed.

    A promise rejection should only be done in exceptional circumstances, and just like it is bad practice to throw a raw string in JavaScript. It is bad practice to reject a promise with the raw string. Always use error constructor new Error, when rejecting a promise.

    Now that we understand the fundamentals of promise creation in its resolved, rejected fate. Let's look at the concept of a promise chain. The then function on a promise creates a new promise that is distinct from the original. We can verify that by simply comparing it with the original promise.

    This second promise is entitled to its own then and catch call backs if you want. If the original first promise resolves, the fate of this second promise is determined by the body of the then call back.

    If you return a value from the call back, that becomes the resolved value of the second promise. Of course, if you don't return a value, JavaScript implicitly returns undefined, and that will become the resolved value.

    If you return a promise from this call back, the resolution of the second promise is determined by the fate of this promise. If the promise resolves, its resolved value is also the resolved value of the second promise.

    If that returned promise is rejected, then the second promise is also rejected. Any run time exceptions in the then call back also resolved in a rejection of the promise. A quick example would be to explicitly throw an error. Another possibility of a run time exception is programming errors like using an undeclared variable.

    One very useful and fundamental behavior of promises is how rejection is propagated. Let's say, we have a chain of few then's followed by a catch. A promise rejection at any point in the chain will result in all subsequent then handlers to be skipped, and execution will jump to the nearest catch handler.

    Of course, if there is no error in the preceding chain, the catch handler is never called. There is more to promises, but understanding of these then chains and catch cascading is sufficient for using asyncawait.