Introduction
JavaScript is a versatile, high-level programming language primarily used for web development. It enables interactive web pages and is an essential part of web applications. JavaScript is easy to learn for beginners but has deep and powerful capabilities for experienced developers.
Grammar and Types
Basic Syntax
JavaScript programs are composed of statements, which are instructions to be executed.
console.log(x); // Outputs: 10
Data Types
JavaScript supports various data types, including:
Primitive Types: String, Number, Boolean, Null, Undefined, Symbol, and BigInt.
let num = 42;
let isActive = true;
Variables
Variables in JavaScript can be declared using var, let, or const.
var has function scope.
let and const have block scope, with const being used for constants.
const PI = 3.14;
Control Flow and Error Handling
Conditionals
Conditionals control the flow of execution based on conditions.
If-else Statements:
if (age >= 18) {
console.log(“Adult“);
} else {
console.log(“Minor“);
}
Error Handling
Error handling is crucial for managing exceptions and ensuring smooth execution.
Try-Catch-Finally:
throw new Error(“Something went wrong!“);
} catch (error) {
console.error(error.message);
} finally {
console.log(“Execution complete.“);
}
Loops and Iteration
For Loop
For loops are used for iterating over a block of code a number of times.
Basic For Loop:
console.log(i); // Outputs: 0, 1, 2, 3, 4
}
While Loop
While loops continue to execute as long as a specified condition is true.
Basic While Loop:
while (i < 5) {
console.log(i); // Outputs: 0, 1, 2, 3, 4
i++;
}
Functions
Declaration and Invocation
Functions are reusable blocks of code that perform a specific task.
Function Declaration:
return `Hello, ${name}!`;
}
console.log(greet(“Alice“)); // Outputs: Hello, Alice!
Arrow Functions
Arrow functions provide a shorter syntax for writing functions.
Arrow Function Syntax:
console.log(add(2, 3)); // Outputs: 5
Expressions and Operators
Arithmetic Operators
Arithmetic operators are used to perform mathematical operations.
Basic Arithmetic:
let product = 4 * 2; // 8
Logical Operators
Logical operators are used to combine or invert Boolean values.
AND, OR, NOT:
let hasID = false;
console.log(isAdult && hasID); // false
console.log(isAdult || hasID); // true
Numbers and Dates
Working with Numbers
JavaScript provides various methods to handle numbers effectively.
Basic Operations:
console.log(num.toFixed(2)); // “123.46”
Working with Dates
The Date object is used to work with dates and times.
Date Object:
console.log(now.toISOString()); // Outputs current date and time in ISO format
Text Formatting
String Methods
Strings can be manipulated using various built-in methods.
Manipulating Strings:
console.log(message.toUpperCase()); // “HELLO, WORLD!”
console.log(message.slice(0, 5)); // “Hello”
Regular Expressions
Pattern Matching
Regular expressions are patterns used to match character combinations in strings.
Using Regex:
let text = “Hello, World!“;
console.log(pattern.test(text)); // true
Indexed Collections
Arrays
Arrays are list-like objects used to store multiple values.
Basic Array Operations:
console.log(fruits.length); // 3
console.log(fruits[1]); // “Banana”
Keyed Collections
Objects
Objects are collections of key-value pairs.
Creating and Accessing Objects:
name: “Alice“,
age: 30
};
console.log(person.name); // “Alice”
Maps
Maps are collections of keyed data items, like objects but with better performance for frequent additions and removals.
Map Object:
map.set(“key1“, “value1“);
console.log(map.get(“key1“)); // “value1”
Working with Objects
Object Methods
Objects can have methods, which are functions associated with the object.
Manipulating Objects:
brand: “Toyota“,
model: “Corolla“
};
car.year = 2020;
console.log(car);
Using Classes
Class Syntax
Classes provide a blueprint for creating objects.
Creating Classes:
constructor(name) {
this.name = name;
}
speak() {
console.log(`${this.name} makes a noise.`);
}
}
let dog = new Animal(“Dog“);
dog.speak(); // “Dog makes a noise.”
Using Promises
Promise Syntax
Promises represent the eventual completion (or failure) of an asynchronous operation.
Handling Asynchronous Operations:
let success = true;
if (success) {
resolve(“Operation successful!“);
} else {
reject(“Operation failed.“);
}
});
promise.then(message => {
console.log(message); // Outputs: Operation successful!
}).catch(error => {
console.error(error);
});
JavaScript Typed Arrays
Typed Array Basics
Typed arrays provide a mechanism for accessing raw binary data.
Using Typed Arrays:
let int32View = new Int32Array(buffer);
int32View[0] = 42;
console.log(int32View[0]); // 42
Iterators and Generators
Iterator Protocol
The iterator protocol allows objects to define or customize their iteration behavior.
Creating Iterators:
[Symbol.iterator]() {
let step = 0;
return {
next() {
step++;
if (step <= 5) {
return { value: step, done: false };
} else {
return { done: true };
}
}
};
}
};
for (let value of iterable) {
console.log(value); // Outputs: 1, 2, 3, 4, 5
}
Generators
Generators simplify the creation of iterators by providing a function-based syntax.
Generator Function:
yield 1;
yield 2;
yield 3;
}
let gen = generator();
console.log(gen.next().value); // 1
console.log(gen.next().value); // 2
console.log(gen.next().value); // 3
Meta Programming
Proxy
Proxies enable the creation of objects with custom behavior for fundamental operations.
Using Proxies:
let handler = {
get: function(obj, prop) {
return prop in obj ? obj[prop] : 42;
}
};
let proxy = new Proxy(target, handler);
console.log(proxy.nonExistentProperty); // 42
JavaScript Modules
Module Syntax
Modules allow you to organize code by exporting and importing functionality across different files.
Import and Export:
export const greet = (name) => `Hello, ${name}!`;
// main.js
import { greet } from ‘./module.js‘;
console.log(greet(‘Alice‘)); // Outputs: Hello, Alice!
By mastering these core concepts and features of JavaScript, you’ll be
