Promise Fundamentals using TypeScript
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).
Instructor: [00:00] 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.
[00:25] 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.
[00:38] 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.
[00:52] 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.
[01:15] 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.
[01:37] 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.
[02:05] 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.
[02:22] 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.
[02:41] 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.
[03:00] 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.
[03:38] 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.
[04:04] 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.
What am I missing? I notice you have a tsconfig file — do I need that?
Yes. Specifically the lib option : https://basarat.gitbooks.io/typescript/content/docs/types/lib.d.ts.html
Is there any difference between throwing an error inside a promise and reject the promise?
@brendan inside a promise chain : no. there is no difference.
Cool thx
Hi! Thanks for the tutorial. I installed Typecript globally, but when I try to run the .ts file in this tutorial, I get the following error: "error TS2693: 'Promise' only refers to a type, but is being used as a value here." What am I missing? I notice you have a tsconfig file — do I need that?