JavaScript Syntax

1. Variables and Data Types:

JavaScript allows you to declare variables using var, let, or const:

var is function-scoped and can be reassigned.
let is block-scoped and can be reassigned.
const is block-scoped but cannot be reassigned (it doesn't mean immutable, just that the variable reference cannot change).

Example:

var x = 10;
let y = "Hello";
const PI = 3.14;

JavaScript has various data types:

Primitive Types: Numbers, strings, booleans, null, undefined, symbols.
Object Types: Arrays, functions, objects.

Example:

let number = 10;
let text = "Hello, World!";
let isTrue = true;
let fruits = ['apple', 'banana', 'orange'];
let person = { name: 'John', age: 30 };

2. Operators:

JavaScript supports various operators:

Arithmetic Operators: +, -, *, /, %.
Assignment Operators: =, +=, -=, *=, /=.
Comparison Operators: ==, !=, ===, !==, >, <, >=, <=.
Logical Operators: && (AND), || (OR), ! (NOT).
Ternary Operator: condition ? value1 : value2.
Typeof Operator: typeof variable (returns the data type of a variable).

Example:

let a = 10;
let b = 5;
let sum = a + b; // 15
let isGreater = a > b; // true
let result = (a > b) ? "A is greater" : "B is greater"; // "A is greater"
console.log(typeof a); // "number"

3. Control Flow Statements:

JavaScript provides conditional and looping statements:

if...else Statement:
javascript
Copy code
let age = 25;
if (age >= 18) {
console.log("You are an adult.");
} else {
console.log("You are a minor.");
}

switch Statement:

let day = 3;
switch (day) {
case 1:
console.log("Monday");
break;
case 2:
console.log("Tuesday");
break;
default:
console.log("Other day");
}

for Loop:

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

while Loop:

let count = 0;
while (count < 3) {
console.log(count);
count++;
}

4. Functions:

Functions in JavaScript can be declared using the function keyword or using arrow functions () =>.

Function Declaration:

function greet(name) {
console.log("Hello, " + name + "!");
}
greet("John"); // Hello, John!

Arrow Function:

const multiply = (a, b) => {
return a * b;
}

console.log(multiply(5, 3)); // 15

5. Objects and Arrays:

JavaScript objects are collections of key-value pairs, and arrays are ordered lists of values.

Object:

let person = {
name: 'Alice',
age: 30,
address: {
city: 'New York',
zip: 10001
}
};
console.log(person.name); // Alice
console.log(person.address.city); // New York

Array:

let colors = ['red', 'green', 'blue'];
console.log(colors[0]); // red
colors.push('yellow'); // Add an element to the end
console.log(colors.length); // 4

6. Classes and Prototypes:

JavaScript supports object-oriented programming through classes and prototypes.

Class:

class Rectangle {
constructor(width, height) {
this.width = width;
this.height = height;
}
calculateArea() {
return this.width * this.height;
}
}
let rect = new Rectangle(5, 10);
console.log(rect.calculateArea()); // 50

Prototype:

function Circle(radius) {
this.radius = radius;
}
Circle.prototype.calculateArea = function() {
return Math.PI * this.radius * this.radius;
};
let circle = new Circle(3);
console.log(circle.calculateArea()); // ~28.27

7. Error Handling:

JavaScript uses try...catch blocks for error handling.

try {
// Code that may throw an error
let result = x / y;
} catch (error) {
console.log("An error occurred: " + error.message);
}

8. Modules and Imports:

JavaScript allows modular programming using modules and imports/exports.

Module (math.js):

export function add(a, b) {
return a + b;
}

Import:

import { add } from './math.js';
console.log(add(3, 5)); // 8

9. Asynchronous Programming:

JavaScript supports asynchronous operations using callbacks, promises, and async/await.

Callback Function:

function fetchData(callback) {
setTimeout(() => {
callback("Data fetched");
}, 2000);
}
fetchData((data) => {
console.log(data);
});

Promise:

function fetchData() {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve("Data fetched");
}, 2000);
});
}
fetchData().then((data) => {
console.log(data);
});

Async/Await:

async function fetchData() {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve("Data fetched");
}, 2000);
});
}
async function getData() {
const data = await fetchData();
console.log(data);
}
getData();

JavaScript syntax encompasses variables, operators, control flow, functions, objects, arrays, classes, error handling, modules, and asynchronous programming. Understanding these fundamental aspects is crucial for developing robust and efficient JavaScript applications.

Practice Excercise Practice now

COMPANY

Products

OTHERS

Partner