JAVASCRIPT

JavaScript Code Block: Syntax, Usage, and Examples

A JavaScript code block is a group of one or more statements enclosed in curly braces {}. Code blocks are used to control which pieces of code run and when, especially inside conditionals, loops, and functions.

How to Use a Code Block in JavaScript

To write a code block in JavaScript, simply wrap your statements inside {}. This structure groups the code together and tells JavaScript to treat it as one unit.

if (true) {
  console.log("I'm inside a code block!");
}

The curly braces here define the code block. Even if there's only one statement inside, using {} clearly marks the beginning and end of that block.

You’ll see code blocks in JavaScript used in many places:

  • After if, else if, and else
  • In for, while, and do...while loops
  • Inside functions
  • Inside arrow functions with multiple statements

When to Use JavaScript Code Blocks

Code blocks aren't just decorative — they're essential for grouping logic and defining scope. Here are some common scenarios where you'll use a code block in JavaScript.

1. Conditional Logic

A code block is required if you want to execute multiple statements in an if or else block. Without curly braces, only the next line runs.

const age = 20;

if (age >= 18) {
  console.log("You can vote.");
  console.log("And get a driver's license.");
}

2. Loops

Every loop structure in JavaScript relies on a code block to know which code should repeat.

for (let i = 0; i < 3; i++) {
  console.log("Loop number:", i);
}

3. Function Bodies

Functions must have a block to contain their code. Even a short function like this one uses a code block.

function greet() {
  console.log("Hello!");
}

4. Arrow Functions with Multiple Lines

For arrow functions, a code block is required if you're doing more than just returning a value.

const sayHi = () => {
  const name = "Tariq";
  console.log(`Hi, ${name}!`);
};

Examples of JavaScript Code Blocks

Let’s look at different types of code blocks in action.

Example 1: Code Block in an If Statement

const isRaining = true;

if (isRaining) {
  console.log("Take an umbrella.");
  console.log("Or wear a raincoat.");
}

Without the code block, only the first line would run. The second would run regardless of the condition.

Example 2: Code Block in a Loop

let count = 0;

while (count < 2) {
  console.log("Counting:", count);
  count++;
}

The code block includes both console.log and count++, so both happen with each loop.

Example 3: Code Block in a Function

function sum(a, b) {
  const result = a + b;
  return result;
}

Here, the code block groups the variable declaration and the return statement.

Example 4: Code Block in an Else Block

const isLoggedIn = false;

if (isLoggedIn) {
  console.log("Welcome back!");
} else {
  console.log("Please log in.");
}

The else block runs only if the if condition fails. The {} ensure the right group of actions runs.

Learn More About JavaScript Code Blocks

Code Block Scope

Each JavaScript code block introduces a new block scope. This affects how variables behave. For example, let and const variables are only accessible inside the block where they’re declared.

{
  let secret = "hidden";
  console.log(secret); // works
}
console.log(secret); // ReferenceError

This concept helps prevent bugs and keeps your variables tidy.

Code Blocks vs. Single-Line Statements

JavaScript allows single-line statements without code blocks, but this can lead to problems.

if (true)
  console.log("Only this runs");
  console.log("This always runs"); // ⚠️ Runs regardless of the condition

Adding a code block avoids confusion:

if (true) {
  console.log("Now it's clear both belong to the if!");
}

Nested Code Blocks

You can place one code block inside another. This is common in nested conditionals or loops.

for (let i = 0; i < 2; i++) {
  if (i === 1) {
    console.log("Nested block triggered");
  }
}

Nested blocks help organize complex logic and keep related actions grouped together.

Formatting and Readability

Using code blocks consistently improves readability. Even when JavaScript doesn't require them, it's a good habit to include {} — especially when you're working on a team or revisiting your own code later.