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

A labeled statement provides an identifier for a statement in JavaScript, allowing control flow directives (`break` and `continue`) to explicitly target and alter the execution path of that specific statement.

```javascript theme={"dark"}
labelIdentifier: statement
```

## Mechanics and Behavior

**Namespace Isolation**
Labels reside in a distinct internal namespace. A label identifier will not collide with variables, functions, or classes sharing the same name within the same scope.

**Scope and Visibility**
A label is only visible within the lexical scope of the statement it prefixes. It cannot be referenced from outside that statement, nor can it be referenced from within nested function boundaries (such as callbacks or closures) inside the labeled statement.

**Interaction with `break`**
The `break` statement can reference a label attached to *any* enclosing statement. This includes iteration statements (`for`, `while`, `do...while`), block statements (`{}`), `switch` statements, `if` statements, and `try...catch` blocks. When executed, `break labelIdentifier;` immediately terminates the targeted labeled statement and transfers control to the statement immediately following it.

```javascript theme={"dark"}
myLabel: if (true) {
  console.log("Execution starts");
  break myLabel; 
  console.log("Unreachable code");
}
console.log("Execution resumes here");
```

**Interaction with `continue`**
The `continue` statement can *only* reference a label attached to an iteration statement. When executed, `continue labelIdentifier;` terminates the current iteration of the targeted loop and evaluates the loop's condition to determine if the next iteration should begin.

```javascript theme={"dark"}
outerLoop: for (let i = 0; i < 3; i++) {
  innerLoop: for (let j = 0; j < 3; j++) {
    if (i === 1 && j === 1) {
      continue outerLoop; // Skips to the next iteration of 'outerLoop'
    }
    console.log(`i=${i}, j=${j}`);
  }
}
```

## Syntax Rules and Restrictions

* **Valid Identifiers:** A label must be a valid JavaScript identifier and cannot be a reserved word (e.g., `class`, `return`, `if`).
* **Strict Mode Constraints:** In strict mode (`"use strict";`), the identifier `let` cannot be used as a label. Additionally, labeling a function declaration throws a `SyntaxError`.
* **Duplicate Labels:** You cannot use the same label identifier more than once within the same nested statement chain. However, sibling statements can share the same label name.
* **Chaining:** Multiple labels can be chained to a single statement, though this is syntactically redundant.

```javascript theme={"dark"}
// Valid label chaining
labelOne: labelTwo: for (let i = 0; i < 5; i++) {
  break labelOne;
}
```

<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>
