JavaScript Programming — A → Z Complete

BEGINNER LEVEL

What is JavaScript?

JavaScript is a programming language that runs in browsers and servers. It makes websites interactive.

Hello World

console.log("Hello World");

Variables

let name = "Aman";
const age = 20;
var city = "Delhi";

Data Types

let a = 10;        // Number
let b = "Hi";     // String
let c = true;     // Boolean
let d = null;     // Null
let e;            // Undefined

Operators

let x=10,y=3;
console.log(x+y);
console.log(x>y);
console.log(x==y);

If Else

let age=18;
if(age>=18){
  console.log("Adult");
}else{
  console.log("Child");
}

Switch

let day=2;
switch(day){
 case 1:console.log("Mon");break;
 case 2:console.log("Tue");break;
}

Loops

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

While Loop

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

Functions

function add(a,b){
 return a+b;
}
console.log(add(2,3));

Arrow Functions

const mul=(a,b)=>a*b;
console.log(mul(2,3));

Arrays

let arr=[1,2,3];
arr.push(4);
console.log(arr);

Objects

let user={name:"Aman",age:20};
console.log(user.name);

String Methods

let s="javascript";
console.log(s.toUpperCase());
console.log(s.length);

Array Methods

[1,2,3].forEach(x=>console.log(x));

INTERMEDIATE LEVEL

DOM Basics

document.body.innerHTML = "Hello";

Query Selector

document.querySelector("h1").style.color="red";

Events

btn.addEventListener("click",()=>alert("clicked"));

Map Filter Reduce

let nums=[1,2,3,4];
console.log(nums.map(x=>x*2));
console.log(nums.filter(x=>x%2==0));

Destructuring

let {name,age}=user;

Spread Operator

let a1=[1,2];let a2=[...a1,3];

Promises

new Promise(res=>res("ok")).then(console.log);

Async Await

async function run(){return "done"}
run().then(console.log);

Error Handling

try{ x(); }catch(e){ console.log(e); }

Timers

setTimeout(()=>console.log("hi"),1000);

LocalStorage

localStorage.setItem("name","Aman");

ADVANCED LEVEL

Fetch API

fetch("https://api.github.com").then(r=>r.json()).then(console.log);

Classes

class User{constructor(n){this.name=n}}
let u=new User("Aman");

Modules

// export
export const x=5;
// import
import {x} from './a.js';

Closures

function outer(){let x=5;return ()=>x;} 

Generators

function* gen(){yield 1;yield 2;} 

Web Storage

sessionStorage.setItem("a",1);

JSON

JSON.stringify({a:1});

WebSocket Concept

// realtime client-server communication

PROJECTS

Beginner Projects

Calculator • Counter • Todo

Intermediate Projects

Weather App • Notes App • Quiz

Advanced Projects

Chat App • Dashboard • Full Stack App

Next Learning Path

Node.js → React → APIs → Databases → Full Stack