How to return response from an asynchronous call in JavaScript?

Asynchronous programming is frequently used in javascript network programming. This technique allows one to start potentially long time-dependent tasks and still be responsive to other events without ending the current execution flow. This can be performed by using async functions in JavaScript.

There are several techniques to return responses from asynchronous calls. The particular approach you choose will depend on the requirements of your application. Here are the most common approaches to handling asynchronous operations in JavaScript:

Callbacks

Callbacks are the original method for handling asynchronous programming. These callbacks allow you to provide a function to be executed that is invoked after the asynchronous function is completed. The following example shows the callback function:

// callback function 
const callbackFunction = (result) => {
  console.log(result)
}
const fetchData = (callback) => {
  // initiate asynchronous call to fetch data from database
  getData(callback)
}
// call the original function with a callback function to handle the response
fetchData(callbackFuntion)

In the above example:

  • Lines 2–4: We are defining a callback function.

  • Lines 6–9: The getData() function makes asynchronous calls, like fetch, and receives a callback function as a parameter to handle the call. This callback function is provided by the fetchData() function from where you need to get the response.

  • Line 12: We are calling the fetchData() function by passing the callBackFunction() as a parameter.

The callbacks are useful to a certain extent. Still, these turn into callback hell for developers when they need to make multiple calls to different sources, making callbacks nested until they become hard to maintain.

Async/await

In 2017, Javascript added support for async/await as a part of the ECMAScript 2017 JavaScript edition, and now it is available in all newer versions. The async and await keywords help in writing the asynchronous functions in a synchronous-looking style. An asynchronous function is a function that does not return a value immediately. Instead, it returns a promise. A promise is a way of representing an eventual result. When the asynchronous function is finished, it will resolve the promise with the result.

The async keyword is used to define asynchronous functions, while the await keyword is used to stall JavaScript from executing functions before a promise is resolved. Let's convert the above example of callback using async/await keywords. The following code block shows the async/await example:

const fetchData = async () => {
  // start asynchronous call to fetch data from database and and wait for it to resolve
  const data = await getData()
  return data
}
// call the original function within async/await block to handle response
( async () => {
  await fetchData()
})

In the above example:

  • Lines 1–5: We are adding the async keyword to the fetchData() function to make it asynchronous. Next, we are waiting for the response from the getData() function using the await() keyword.

  • Lines 8–10: We are calling the fetchData() function within async/await block to handle the response.

Free Resources

Copyright ©2026 Educative, Inc. All rights reserved