? JavaScript Syntax

? Quick Overview

JavaScript syntax is the set of rules that defines a correctly structured JavaScript program. It controls how we write instructions so that the browser can understand and execute them.

Once you know the basic syntax—values, identifiers, statements, semicolons, and code blocks—you can start writing valid JavaScript programs with confidence.

? Key Concepts

Values: Data like numbers, strings, and booleans.
Variables: Named containers for values using let, const, or var.
Statements: Individual instructions executed line by line.
Identifiers: Names for variables, functions, and properties.
Semicolons: Mark the end of a statement (recommended).
Code blocks: Groups of statements inside curly braces { }.

? Syntax & Theory

In JavaScript, every piece of logic is written as statements using values and variables. Statements are grouped into blocks and organised using control structures (like if and for).

To keep code readable and error-free, follow the rules for identifiers, use semicolons consistently, and always match opening and closing braces.

? JavaScript Values

JavaScript values can be fixed values (literals) or variable values (stored in variables).

Literals: 10, "Hello", true
Variables: Declared with let, const, or var

? View Code Example – Values & Variables

let x = 5;
const y = "Hello";

? JavaScript Statements

A JavaScript program is made up of statements, which are executed line by line. Each statement performs a specific action.

? View Code Example – Simple Statements

let a = 5;
let b = 6;
let c = a + b;

?️ JavaScript Identifiers

Identifiers are names used for variables, functions, and properties. Rules:

Must begin with a letter, $, or _.
Cannot be a reserved keyword (like let or return).
Case-sensitive (myVar is different from myvar).

? View Code Example – Valid Identifiers

let myVar = 10;
let $price = 99;
let _name = "John";

? Semicolons

Statements are usually terminated with a semicolon. JavaScript has automatic semicolon insertion, but adding them explicitly is recommended for clarity and to prevent subtle errors.

? View Code Example – Using Semicolons

let age = 25;
console.log(age);

? Code Blocks

Blocks of code are grouped by curly braces { }. They are used in functions, loops, and conditionals to group multiple statements.

? View Code Example – If Statement Block

if (x > 0) {
  console.log("Positive");
}

? Live Output & Explanation

In the statements example:

let a = 5; stores the value 5 in the variable a.
let b = 6; stores the value 6 in the variable b.
let c = a + b; adds a and b to get 11 and stores it in c.

If you log c using console.log(c);, the console will show 11.

In the code block example, if x is greater than 0, the browser prints "Positive" to the console. Otherwise, the block is skipped.

? Tips & Best Practices

Use clear, meaningful names for identifiers (e.g., totalPrice instead of x1).
Use semicolons consistently to avoid issues with automatic semicolon insertion.
Keep code blocks small and focused on a single purpose.
Comment important parts of your code for better understanding and maintainability.
Follow a consistent style (indentation, spacing) to make your code easier to read.

? Try It Yourself

Declare two variables and print their sum using console.log().
Create a function with a code block that logs a custom message.
Experiment with different identifiers (using letters, $, and _).
Try using different operators (like +, -, *, /) in the browser console.
Write a small if block that checks a variable and logs different messages.