JavaScript Syntax

JavaScript Syntax – Learn JS Code Structure

JavaScript syntax is the set of rules that define a correctly structured JavaScript program

// How to Create variables:
var x;
let y;

// How to use variables:
x = 7;
y = 3;
let z = x * y;

Try It Now

1. Case Sensitivity

JavaScript is case-sensitive. Variable and function names are case-sensitive, which means myVar and myvar would be treated as different identifiers.

2. Statements

JavaScript programs are a sequence of statements, each ending with a semicolon (;). However, semicolons are optional but recommended for clarity and to avoid errors.

let x = 5;
let y = 6;

3. Comments

Comments are ignored by the JavaScript engine and are used to explain the code.

Single-line comments: // This is a single-line comment
Multi-line comments:
```
/*
 This is a 
 multi-line comment
*/
```

4. Variables

Variables are used to store data. They can be declared using var, let, or const.

var x = 5;
let y = 6;
const z = 7;

Try It Now

5. Data Types

JavaScript supports several data types:

String: 'Hello' or "World"
Number: 42 or 3.14
Boolean: true or false
Null: null
Undefined: A variable that has not been assigned a value
Object: { name: "John", age: 30 }
Array: [1, 2, 3]

6. Operators

JavaScript supports various operators:

Arithmetic Operators: +, -, *, /, %
Assignment Operators: =, +=, -=, *=, /=
Comparison Operators: ==, ===, !=, !==, >, <
Logical Operators: && (AND), || (OR), ! (NOT)

7. Functions

Functions are blocks of code designed to perform a particular task.

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

Try It Now

8. Conditionals

Conditional statements control the flow of the program.

let x = 10;
if (x > 5) {
  console.log("x is greater than 5");
} else {
  console.log("x is less than or equal to 5");
}

Try It Now

9. Loops

Loops allow repeated execution of a block of code.

For Loop:

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

Try It Now

While Loop:

let i = 0;
while (i < 5) {
  console.log(i);
  i++;
}

Try It Now

10. Arrays

Arrays are used to store multiple values in a single variable.

let fruits = ["Apple", "Banana", "Cherry"];
console.log(fruits[0]); // Output: Apple

Try It Now

11. Objects

Objects are collections of key-value pairs.

let person = {
  firstName: "John",
  lastName: "Doe",
  age: 30
};
console.log(person.firstName); // Output: John

Try It Now

12. Events

JavaScript can react to events like clicks, keypresses, and more.

document.getElementById("myButton").onclick = function() {
  alert("Button clicked!");
};

Try It Now

13. Arrow Functions

A shorter syntax for writing functions.

const greet = (name) => "Hello, " + name;
console.log(greet("Alice")); // Output: Hello, Alice

Try It Now

14. Template Literals

Allows embedding expressions inside string literals.

let name = "John";
let greeting = `Hello, ${name}!`;
console.log(greeting); // Output: Hello, John!

Try It Now

Conclusion

Understanding JavaScript syntax is essential for writing clear and functional code. By mastering these basic elements, you can start building interactive and dynamic web applications.