Chapter 4. Mastering Promises

This chapter will cover the following recipes:

Understanding and implementing basic Promises
Chaining Promises and Promise handlers
Creating Promise wrappers with Promise.resolve() and Promise.reject()
Implementing Promise barriers with Promise.all()
Canceling asynchronous actions with Promise.race()
Converting a Promise into an Observable
Converting an HTTP service Observable into ZoneAwarePromise

Introduction

In Angular 1, promises acted as strange birds. They were essential for building robust asynchronous applications, but using them seemed to come at a price. Their implementation by way of the $q service and the duality of promise and deferred objects seemed bizarre. Nonetheless, once you were able to master them, it was easy to see how they could be the foundation of extremely robust implementations in the single-threaded event-driven world of JavaScript.

Fortunately, for developers everywhere, ES6 formally embraces the Promise feature as a central component. Since TypeScript is a superset of ES6, you will be pleased to know that you can wield promises everywhere in Angular without extra baggage. Although Observables subsume a lot of the utility offered by promises, there is still very much a place for them in your toolkit.

Tip

Being able to use Promises natively is a privilege of TypeScript to a JavaScript transpilation. As of now, some browsers support Promises natively, while some do not. Good news is that if you're writing your applications in TypeScript and are transpiling them properly, you don't have to worry about this! Really, the only time you would need to consider the actual transpilation mechanics is when you need information related to the performance or payload size benefits of native implementations versus their respective polyfills, and this should never be an issue for nearly all applications.