Introducing asynchronous JavaScript - Learn web development | MDN

Tags

Top Highlights

• functions provided by browsers

• attaching event listeners

• Asynchronous programming is a technique that enables your program to start a potentially long-running task and still be able to be responsive to other events while that task runs, rather than having to wait until that task has finished

• An event handler is a particular type of callback. A callback is just a function that's passed into another function, with the expectation that the callback will be called at the appropriate time

• "callback hell" or the "pyramid of doom"

• at a time

• steps through

• Making HTTP requests

• Accessing a user's camera or microphone

• Asking a user to select files

• Introducing asynchronous JavaScript

• Synchronous programming

• A long-running synchronous function

• Only one thing can happen at a time

• Note: It is important to remember that alert(), while being very useful for demonstrating a synchronous blocking operation, is terrible for use in real world applications

• many Web API features now use asynchronous code to run

• Instead, you need your code to wait until the response is returned before it tries to do anything else to it.

• There are two main types of asynchronous code style you'll come across in JavaScript code, old-style callbacks and newer promise-style code. In the below sections we'll review each of these in turn.

• Callbacks are versatile — not only do they allow you to control the order in which functions are run and what data is passed between them

• Note that not all callbacks are async — some run synchronously.