> ## 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 Return Statement

The `return` statement terminates the execution of a function and specifies a value to be passed back to the function's caller. When the JavaScript engine encounters this statement, control is transferred out of the current function's execution context and back to the calling execution context, provided the `return` is not intercepted by a `finally` block.

```javascript theme={"dark"}
return [expression];
```

## Scope Constraints

The `return` statement is lexically constrained to the body of a function. Attempting to use a `return` statement outside of a function body—such as at the top level of a standard script or an ES module—will result in a `SyntaxError`.

## Mechanics and Behavior

**Expression Evaluation**
The `expression` following the `return` keyword is optional. If provided, the engine evaluates the expression and returns the resulting value.

```javascript theme={"dark"}
function evaluateExpression() {
  return 10 * 5; // Evaluates to 50, then returns 50
}
```

**Execution Termination and `finally` Blocks**
A `return` statement generally acts as an immediate exit point. Statements within the function block that lexically follow a reachable `return` statement are typically classified as dead code and will not execute.

However, if a `return` statement is executed inside a `try` or `catch` block, the JavaScript engine will intercept the termination to execute the code within a corresponding `finally` block before actually leaving the function's execution context.

```javascript theme={"dark"}
function haltExecution() {
  return true;
  console.log("This is dead code and will not execute."); 
}

function finallyIntercept() {
  try {
    return "try block return";
  } finally {
    console.log("This executes before the function terminates.");
  }
}
```

**Implicit Returns**
If a function's execution reaches the end of its block without encountering a `return` statement, or if the `return` keyword is used without an accompanying expression, the JavaScript engine implicitly returns the primitive value `undefined`.

```javascript theme={"dark"}
function implicitUndefined() {}
function explicitUndefined() { return; }

console.log(implicitUndefined()); // undefined
console.log(explicitUndefined()); // undefined
```

## Automatic Semicolon Insertion (ASI) Caveat

JavaScript's lexical grammar enforces a strict rule regarding line terminators and the `return` statement. A line break cannot be placed between the `return` keyword and its corresponding expression.

If a line terminator separates the two, the engine's Automatic Semicolon Insertion (ASI) mechanism implicitly inserts a semicolon immediately after the `return` keyword. This causes the function to return `undefined`, and the intended expression is treated as an unreachable standalone statement.

**Incorrect Syntax (ASI Trap):**

```javascript theme={"dark"}
function getObject() {
  return 
  {
    status: "active"
  };
}
// Engine interprets as:
// return; 
// { status: "active" }; 
// Returns: undefined
```

**Correct Syntax:**
To return an object literal or a multi-line expression, the expression must begin on the same line as the `return` keyword, typically utilizing grouping operator parentheses.

```javascript theme={"dark"}
function getObject() {
  return {
    status: "active"
  };
}

// OR using grouping parentheses for multi-line expressions
function getObjectSafe() {
  return (
    {
      status: "active"
    }
  );
}
```

<div
  style={{ 
display: "flex", 
justifyContent: "space-between", 
alignItems: "center", 
maxWidth: "754px", 
padding: "1rem 0",
marginBottom: "24px"
}}
>
  <span style={{ fontWeight: "bold", fontSize: "1.25rem", color: "var(--tw-prose-headings)", fontFamily: "Inter, ui-sans-serif, system-ui, sans-serif" }}>Tired of Poor JavaScript Skills? Fix That With Deep Grasping!</span>

  <a
    href="https://syntblaze.com"
    target="_blank"
    style={{ 
  marginLeft: "24px",
  textDecoration: "none", 
  backgroundColor: "#007AFF",
  color: "#ffffff", 
  padding: "6px 16px", 
  borderRadius: "16px",
  fontSize: "0.9rem",
  fontWeight: "600",
  textAlign: "center",
  transition: "background-color 0.2s ease"
}}
  >
    Learn More
  </a>
</div>

<div style={{ display: "flex", gap: "12px", flexWrap: "wrap" }}>
  <img src="https://mintcdn.com/syntblazellc/-L0ums_2lctDSZ1l/images/skill-tracking.png?fit=max&auto=format&n=-L0ums_2lctDSZ1l&q=85&s=b9b0305c93bb501c9e767b5c76c88835" style={{ width: "30%", minWidth: 60 }} width="621" height="1344" data-path="images/skill-tracking.png" />

  <img src="https://mintcdn.com/syntblazellc/23tyuOzaWS88qFlc/images/nuggets.png?fit=max&auto=format&n=23tyuOzaWS88qFlc&q=85&s=c86c80197299762989e9b882419b2109" style={{ width: "30%", minWidth: 60 }} width="621" height="1344" data-path="images/nuggets.png" />

  <img src="https://mintcdn.com/syntblazellc/-L0ums_2lctDSZ1l/images/bite-sized-exercises.png?fit=max&auto=format&n=-L0ums_2lctDSZ1l&q=85&s=a65f9a38c37ff28ab73ed783c53c60e3" style={{ width: "30%", minWidth: 60 }} width="621" height="1344" data-path="images/bite-sized-exercises.png" />
</div>

<div style={{ display: "flex", gap: "12px", flexWrap: "wrap", marginTop: "12px" }}>
  <img src="https://mintcdn.com/syntblazellc/-L0ums_2lctDSZ1l/images/mastery-chain.png?fit=max&auto=format&n=-L0ums_2lctDSZ1l&q=85&s=748a1763454713e679260fbb95f154a2" style={{ width: "30%", minWidth: 60 }} width="621" height="1344" data-path="images/mastery-chain.png" />

  <img src="https://mintcdn.com/syntblazellc/-L0ums_2lctDSZ1l/images/element-previews.png?fit=max&auto=format&n=-L0ums_2lctDSZ1l&q=85&s=242f61448ff5dd6deaaab2dccc13b507" style={{ width: "30%", minWidth: 60 }} width="621" height="1344" data-path="images/element-previews.png" />

  <img src="https://mintcdn.com/syntblazellc/-L0ums_2lctDSZ1l/images/element-explanations.png?fit=max&auto=format&n=-L0ums_2lctDSZ1l&q=85&s=cf0fc1c31f9cd0fc26716781be05fbc9" style={{ width: "30%", minWidth: 60 }} width="621" height="1344" data-path="images/element-explanations.png" />
</div>
