JavaScript from Zero to Hero

console.log() is how we print messages. It's like telling your computer to "speak" and show something!

A variable is like a box where you store information. You give the box a name, and put something inside it!

JavaScript has different types of data. Think of it like different kinds of things you can put in boxes!

if/else lets your code make decisions! Like asking: "IF this is true, do this, ELSE do that"

if (condition) {
  // do this if condition is true
} else if (another condition) {
  // do this if first was false, but this is true
} else {
  // do this if all conditions are false
}

A shorter way to write simple if/else in one line!

condition ? valueIfTrue : valueIfFalse

// Example:
let status = age >= 18 ? "adult" : "minor";

When you have many specific values to check, use switch!

Loops let you run the same code multiple times without writing it again and again!

for (start; condition; step) {
  // code to repeat
}

// Example:
for (let i = 0; i < 5; i++) {
  console.log(i);  // prints 0, 1, 2, 3, 4
}

Keeps running while the condition is true. Be careful of infinite loops!

while (condition) {
  // code runs while condition is true
  // make sure to change the condition!
}

break immediately exits the loop, skipping all remaining iterations!

continue skips the rest of the current iteration and jumps to the next one!

Labels let you break or continue outer loops from inside nested loops!

A function is like a recipe - a set of instructions you can use again and again!

Arrow functions are a shorter, modern way to write functions!

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

// Arrow function (same thing!)
const add = (a, b) => a + b;

// Arrow function with one parameter
const double = x => x * 2;

// Arrow function with body
const greet = (name) => {
  console.log("Hello " + name);
  return "Greeted!";
};

An array is a list that holds multiple values! Like a shopping list or a playlist.

// Array syntax
let fruits = ["🍎", "🍌", "🍊", "🍇"];
//  Index:      0      1      2      3

// Access by index (starts at 0!)
fruits[0]  // "🍎" (first item)
fruits[2]  // "🍊" (third item)

map() creates a new array by transforming each item!

const numbers = [1, 2, 3, 4, 5];
const doubled = numbers.map(n => n * 2);
// Result: [2, 4, 6, 8, 10]

filter() creates a new array with only the items that pass a test!

const numbers = [1, 2, 3, 4, 5, 6];
const evens = numbers.filter(n => n % 2 === 0);
// Result: [2, 4, 6]

reduce() takes all items and combines them into a single value!

const numbers = [1, 2, 3, 4, 5];
const sum = numbers.reduce((total, n) => total + n, 0);
// Result: 15

// reduce(callback, startValue)
// callback: (accumulator, currentValue) => newAccumulator

find() returns the first item that matches. findIndex() returns its position.

You can chain map(), filter(), and more together!

An object stores data in key-value pairs. Like a person with name, age, job!

const person = {
  name: "John",      // key: value
  age: 25,
  isStudent: true,
  hobbies: ["coding", "gaming"]
};

// Access with dot or brackets
person.name      // "John"
person["age"]    // 25

Objects can have functions too! They're called methods.

Get all keys, values, or key-value pairs from an object!

Use backticks (`) to create strings with variables inside! Much easier than + concatenation.

const name = "Alice";
const age = 25;

// Old way (concatenation)
console.log("Hello, " + name + "! You are " + age + " years old.");

// New way (template literals) - Much cleaner! ✨
console.log(`Hello, ${name}! You are ${age} years old.`);

JavaScript has powerful built-in methods for working with numbers and mathematical operations!

The Date object lets you work with dates and times in JavaScript!

Scope determines where variables are accessible in your code.

A closure is when a function "remembers" variables from its outer scope even after that scope has finished executing. This is one of the most powerful features in JavaScript!

The this keyword refers to the object that is executing the current function. Its value depends on HOW the function is called, not where it's defined!

Destructuring lets you extract values from arrays and objects into variables!

JavaScript is single-threaded but can handle async operations without blocking!

The Event Loop is how JavaScript handles asynchronous operations despite being single-threaded. It's essential knowledge for senior developers!

The fetch() API lets you make HTTP requests to servers and APIs!

localStorage lets you store data in the browser that persists even after closing!

try/catch lets you handle errors without crashing your program!

A higher-order function either takes a function as an argument or returns a function!Currying transforms a function with multiple arguments into a sequence of functions.

Modules let you split code into separate files and import/export between them!

JSON is the standard format for sending data between servers and web apps!

Classes are blueprints for creating objects with shared properties and methods!

Every JavaScript object has a prototype - another object it inherits from!

Symbols are unique, immutable identifiers.Iterators define how objects are looped over!

Generators are functions that can be paused and resumed, producing a sequence of values!

Map and Set are more powerful than plain objects and arrays!

Proxy lets you intercept and customize operations on objects!

RegEx (Regular Expressions) are patterns for matching text!

Understanding performance helps you write faster, more efficient code!

Security is crucial! Learn common vulnerabilities and how to prevent them.

Understanding memory management is crucial for building performant applications. JavaScript uses automatic garbage collection, but memory leaks can still occur!

V8 is Google's JavaScript engine used in Chrome and Node.js. Understanding how it works helps you write faster code!

Understanding event propagation (bubbling & capturing) and efficient DOM manipulation is essential for building performant web applications.

Functional programming (FP) is a paradigm that treats computation as evaluation of mathematical functions. It emphasizes immutability and pure functions.

Node.js has powerful features for building scalable server-side applications. Understanding EventEmitter, Streams, and Worker Threads is essential!

WeakMap and WeakSet hold weak references to objects. If an object has no other references, it can be garbage collected even if it's in a WeakMap!

Understanding the difference between microtasks and macrotasks is crucial for predicting JavaScript execution order. Microtasks always run before macrotasks!

Understanding the difference between shallow and deep copying is essential for avoiding unexpected mutations!

Design patterns are proven solutions to common programming problems. They make code more maintainable, reusable, and scalable.