> ## Documentation Index
> Fetch the complete documentation index at: https://docs.syntblaze.com/llms.txt
> Use this file to discover all available pages before exploring further.
# JavaScript Async Method
An asynchronous method in JavaScript is a function declared with the `async` keyword that operates asynchronously via the event loop. It guarantees that the function's return value is always a newly allocated `Promise` object. If the function returns a non-Promise value, the JavaScript engine implicitly wraps it in a resolved `Promise`. If the function throws an exception, it returns a rejected `Promise`. Crucially, if the function returns an existing `Promise`, the `async` function does not return it as-is; instead, it returns a new `Promise` that adopts the state (fulfillment or rejection) of the returned `Promise`, meaning the returned object reference is always distinct.
A primary technical utility of an `async` method is establishing an execution context where the `await` operator can be utilized. (Note: As of ES2022, Top-Level `await` allows the `await` keyword to be used entirely outside of `async` functions at the top level of ES modules).
The `await` keyword pauses the execution of the `async` function until its operand settles (either fulfills or rejects). This operand does not strictly need to be a `Promise`; `await` accepts non-Promise values (e.g., `await 42`), which the engine implicitly treats as a resolved `Promise`. During the pause, control is yielded back to the calling execution context, preventing the main thread from blocking. Once the awaited operand settles, the continuation of the `async` function is scheduled on the microtask queue.
## Syntax Variations
The `async` modifier can be applied to various function definitions, including declarations, expressions, arrow functions, and class/object methods:
```javascript theme={"dark"}
// Function Declaration
async function asyncDeclaration() {
return 1;
}
// Function Expression
const asyncExpression = async function() {
return 2;
};
// Arrow Function
const asyncArrow = async () => {
return 3;
};
// Object Method
const obj = {
async asyncMethod() {
return 4;
}
};
// Class Method
class MyClass {
async asyncClassMethod() {
return 5;
}
}
```
## Return Value Mechanics
Because an `async` method strictly returns a newly allocated `Promise`, standard return statements and thrown errors are automatically transformed by the engine:
```javascript theme={"dark"}
async function returnPrimitive() {
return "string";
// Engine transforms to a new Promise resolved with "string"
}
async function throwError() {
throw new Error("fail");
// Engine transforms to a new Promise rejected with the Error
}
async function returnPromise() {
const p = Promise.resolve("existing promise");
return p;
// Returns a NEW Promise that adopts the state of 'p'.
// The expression (returnPromise() === p) evaluates to false.
}
```
## Execution Flow and `await`
When `await` is used within an `async` method, it unwraps the resolved value of the operand. If the awaited operand is a rejected `Promise`, the `await` expression throws the rejection reason as an exception, which can be intercepted using standard synchronous `try...catch` blocks.
```javascript theme={"dark"}
async function executionFlow() {
try {
// Execution context pauses here until the Promise fulfills
const result = await Promise.resolve(10);
// Awaits a non-Promise value; implicitly treated as Promise.resolve(2)
const multiplier = await 2;
// The following code executes in a new microtask
const mathematicalOperation = result * multiplier;
// Awaited rejections are thrown as synchronous exceptions
await Promise.reject(new Error("Rejection reason"));
// This line is unreachable due to the thrown error above
return mathematicalOperation;
} catch (error) {
// Catches the rejected Promise from the await expression
return error.message;
}
}
```
Tired of Poor JavaScript Skills? Fix That With Deep Grasping!
Learn More
