JavaScript
Async/Await
Programming
Debugging
Console.LOG

Async/Await func doesn't wait to console.log it's response

Master System Design with Codemia

Enhance your system design skills with over 120 practice problems, detailed solutions, and hands-on exercises.

Introduction

When developers say an async function does not wait before console.log, the issue is usually not await itself. It is almost always one of three mistakes: forgetting to await a promise, logging outside the async flow, or assuming top-level code pauses automatically. Once you separate promise creation from promise consumption, the behavior becomes predictable.

async and await Only Pause the Current Async Function

An async function always returns a promise. await pauses that function until the awaited promise settles, but it does not pause unrelated code outside that function.

javascript
1function delay(ms) {
2  return new Promise((resolve) => setTimeout(resolve, ms));
3}
4
5async function run() {
6  await delay(100);
7  console.log("inside run after wait");
8}
9
10run();
11console.log("outside run");

The second log runs immediately because it is outside the awaited async flow.

The Most Common Bug: Missing await

If you call an async function but do not await its result, execution keeps moving.

javascript
1function fetchName() {
2  return new Promise((resolve) => {
3    setTimeout(() => resolve("Ada"), 100);
4  });
5}
6
7async function main() {
8  const namePromise = fetchName();
9  console.log(namePromise);
10}
11
12main();

Correct version:

javascript
1async function main() {
2  const name = await fetchName();
3  console.log(name);
4}
5
6main();

If you want the resolved value, you need await or explicit .then(...).

Logging in the Wrong Scope

Another common mistake is assigning a result in an async callback and then logging it too early.

Incorrect:

javascript
1let result;
2
3async function load() {
4  result = await fetchName();
5}
6
7load();
8console.log(result);

Correct:

javascript
1async function load() {
2  const result = await fetchName();
3  console.log(result);
4}
5
6load();

Or wait for the async function itself:

javascript
1async function load() {
2  return await fetchName();
3}
4
5load().then((result) => {
6  console.log(result);
7});

The key is keeping the log in the promise chain or awaiting the outer async function.

Error Handling Matters

Async functions reject their returned promise when an error occurs. If you do not handle that rejection, your expected log may never run.

javascript
1async function main() {
2  try {
3    const name = await fetchName();
4    console.log(name);
5  } catch (err) {
6    console.error("load failed:", err);
7  }
8}
9
10main();

This is especially important when the missing log is actually a hidden exception.

Parallel Work Versus Sequential Work

Sometimes developers add await inside a loop and expect logs to appear faster or in a different order. Sequential await waits one by one, while Promise.all runs tasks concurrently.

Sequential:

javascript
1async function sequential() {
2  const a = await fetchName();
3  const b = await fetchName();
4  console.log(a, b);
5}

Parallel:

javascript
1async function parallel() {
2  const [a, b] = await Promise.all([fetchName(), fetchName()]);
3  console.log(a, b);
4}

If the tasks are independent, Promise.all is often the better choice.

Top-Level await Is Special

In regular scripts, you cannot assume top-level code waits automatically. In ES modules, top-level await is allowed in supported environments, but that is different from classic script execution.

javascript
const value = await fetchName();
console.log(value);

If you are not in a module context, wrap logic in an async function instead.

Common Pitfalls

One common mistake is thinking await pauses the whole program instead of only the current async function. Another is logging a promise object rather than its resolved value. Developers also place console.log after an async call without awaiting the outer function. Unhandled rejections can hide why logging never happened. Finally, sequential awaits are sometimes used where Promise.all was actually intended.

Summary

  • 'await pauses only the current async function, not unrelated code.'
  • If you want a resolved value, you must await the promise or use .then(...).
  • Keep console.log inside the awaited flow if it depends on async data.
  • Add try and catch so hidden rejections do not swallow expected output.
  • Use Promise.all for independent async tasks that should run in parallel.
  • Debug ordering issues by tracing promise boundaries, not by guessing.

Course illustration
Course illustration

All Rights Reserved.