What is JavaScript Syntax?

JavaScript syntax is the set of rules that define how JavaScript programs are written and understood by the browser. Just like grammar in a language, syntax ensures the code is structured and functional.

Key Components of JavaScript Syntax

1. Statements

• JavaScript code is made up of statements, which are instructions the browser executes.
• Each statement is written on a new line and usually ends with a semicolon (;).

Example:

let name = "John"; // Statement that declares a variable
console.log(name); // Statement that prints the variable value

2. Keywords

Keywords are reserved words with specific meanings in JavaScript. You use them to perform actions like declaring variables or creating functions.

Common Keywords:

• var, let, const – Declare variables
• if, else – Conditional statements
• function – Declare functions
• return – Return a value from a function

Example:

let age = 20; // 'let' is a keyword
if (age >= 18) {
  console.log("You are an adult."); // 'if' is a keyword
}

3. Variables

Variables store data and follow specific syntax rules for declaration:

• let and const (modern syntax)
• var (older syntax)

Syntax:

let variableName = value;
const constantName = value;

Example:

let city = "London";
const pi = 3.14;

4. Data Types

JavaScript supports various data types such as:

• Strings (“text”)
• Numbers (123)
• Booleans (true/false)
• Arrays ([1, 2, 3])
• Objects ({ key: value })

Example:

let isAvailable = true; // Boolean
let items = ["Apple", "Banana", "Cherry"]; // Array

5. Operators

JavaScript uses operators to perform operations like addition, comparison or logical evaluation.

Examples:

let sum = 5 + 3;         // Arithmetic Operator
let isEqual = 10 == 10;  // Comparison Operator
let result = true && false; // Logical Operator

6. Functions

Functions are blocks of reusable code that execute a specific task.

Syntax:

function functionName(parameters) {
  // Code to be executed
}

Example:

function greet(name) {
  return "Hello, " + name + "!";
}
console.log(greet("Alice")); // Outputs: Hello, Alice!

7. Control Structures

Control structures manage the flow of execution in your program.

• Conditional Statements:

if (condition) {
  // Code block
} else {
  // Another code block
}

Example:

let score = 85;
if (score > 90) {
  console.log("Excellent!");
} else {
  console.log("Good job!");
}

• Loops:

for (let i = 0; i < 5; i++) {
  console.log("Iteration: " + i);
}

8. Comments

Comments explain the code and are ignored by the browser.

• Single-line comment: Use //
• Multi-line comment: Use /* */

Example:

// This is a single-line comment
/*
This is a 
multi-line comment
*/

9. Objects and Arrays

• Objects: Store data in key-value pairs.
• Arrays: Store multiple values in a single variable.

Object Example:

let student = {
  name: "John",
  age: 21,
  course: "JavaScript"
};
console.log(student.name); // Access object property

Array Example:

let colors = ["Red", "Green", "Blue"];
console.log(colors[0]); // Access array element

10. Semicolons and Whitespace

• Semicolons: Used to separate statements (optional but recommended).
• Whitespace: Ignored by JavaScript but improves readability.

Example Without Semicolons:

let a = 5
let b = 10
console.log(a + b)

Recommended:

let a = 5;
let b = 10;
console.log(a + b);

Best Practices for Writing JavaScript Syntax

Use Descriptive Names
Avoid generic names like x or y for variables.

let productPrice = 100; // Descriptive

Indentation and Formatting
Write clean, indented code to enhance readability.

if (condition) {
    // Code block
}

Avoid Global Variables
Always declare variables with let or const to prevent scope issues.

Use Comments Wisely
Add meaningful comments without cluttering the code.