JavaScript (ECMAScript 2023+) is a modern, versatile language for web, server, and app development. It powers interactive websites, APIs, and more.
- What is JavaScript?
- Variables & Data Types
- Operators
- Control Flow (Conditionals & Loops)
- Functions
- Arrays & Objects
- DOM Manipulation
- Events
- ES6+ & Latest Features
- Asynchronous JavaScript
- Error Handling
- Modules
- classNamees & OOP
- Best Practices
JavaScript is a high-level, interpreted language that runs in browsers and on servers (Node.js). It supports functional, object-oriented, and event-driven programming.
let name = "Alice"; // String const age = 30; // Number let isActive = true; // Boolean let user = null; // Null let data; // Undefined let big = 123n; // BigInt let sym = Symbol("id"); // Symbol- Arithmetic:
+,-,*,/,%,** - Assignment:
=,+=,-= - Comparison:
==,===,!=,!==,<,> - Logical:
&&,||,! - Nullish:
?? - Optional Chaining:
?.
if (age > 18) { console.log("Adult"); } else { console.log("Minor"); }for (let i = 0; i < 5; i++) { console.log(i); } for (const fruit of fruits) { console.log(fruit); } fruits.forEach((fruit) => console.log(fruit));function greet(name) { return `Hello, ${name}!`; } const add = (a, b) => a + b; const double = (x) => x * 2;const fruits = ["Apple", "Banana", "Cherry"]; fruits.push("Mango"); const [first, ...rest] = fruits;const user = { name: "Alice", age: 30, greet() { return `Hi, ${this.name}`; }, }; const { name, age } = user;const title = document.getElementById("main-title"); title.textContent = "Welcome!"; title.style.color = "blue";document.querySelector("button").addEventListener("click", () => { alert("Button clicked!"); });- Arrow Functions
- Template Literals
- Destructuring
- Spread/Rest Operators
- classNamees
- Modules (
import/export) - Optional Chaining (
?.) - Nullish Coalescing (
??) - Private Fields in classNamees (
#field) - Top-level Await
- Array
at()method - Object.hasOwn()
- Promise.any()
- Logical Assignment Operators (
||=,&&=,??=) - Temporal API (upcoming)
setTimeout(() => { console.log("Done!"); }, 1000);fetch("/api/data") .then((res) => res.json()) .then((data) => console.log(data));async function getData() { const res = await fetch("/api/data"); const data = await res.json(); console.log(data); }try { // risky code } catch (error) { console.error(error); } finally { // cleanup }// math.js export function add(a, b) { return a + b; } // app.js import { add } from "./math.js";className Animal { #privateField = "secret"; constructor(name) { this.name = name; } speak() { console.log(`${this.name} makes a sound.`); } } className Dog extends Animal { speak() { console.log(`${this.name} barks.`); } }- Use
constandlet(avoidvar) - Write clean, readable code
- Use strict equality (
===) - Keep functions short and focused
- Handle errors gracefully
- Comment your code
- Avoid global variables
- Use modern features
- Stay updated with ECMAScript releases
Pro Tip: JavaScript is always evolving. Master the latest features and best practices to write robust, modern code!