Hey Devs! 👋
I recently went all-in on learning JavaScript—from the absolute basics to the concepts behind how JS works under the hood. But here’s the twist:

❌ I didn’t learn “everything.”
✅ I learned only what really matters to build real-world projects & crack interviews.

Let me share what I focused on 👇


1️⃣ var, let, const: What's the Real Difference?

var x = 10;
let y = 20;
const z = 30;

x = 100; // ✅ allowed
y = 200; // ✅ allowed
z = 300; // ❌ Error: Assignment to constant variable
  • var is function-scoped, while let & const are block-scoped.
  • const can't be reassigned.
  • Use let and const — forget var in modern JS.

2️⃣ Hoisting 🏗️

console.log(a); // undefined
var a = 10;

sayHi(); // "Hi!"
function sayHi() {
  console.log("Hi!");
}
  • var gets hoisted with undefined
  • Functions get hoisted completely

3️⃣ Data Types 💡

// Primitives
let num = 5;
let str = "Hello";

// Reference
let obj = { name: "Dev" };
let arr = [1, 2, 3];
  • Learn the difference between primitive and reference types
  • Reference types are stored in heap memory

4️⃣ Conditionals & Loops 🔁

if (true) {
  console.log("Runs!");
}

for (let i = 0; i < 3; i++) {
  console.log(i); // 0, 1, 2
}
  • Master if, else, switch, for, while, do while

5️⃣ Functions = Power 💪

function greet(name) {
  return `Hello, ${name}`;
}

const greetArrow = (name) => `Hello, ${name}`;
  • First-class citizens ✅
  • You can pass them, return them, assign them
  • Understand callback, arrow, pure, higher-order, IIFE

6️⃣ Arrays & Objects 🔧

let nums = [1, 2, 3];
nums.push(4); // [1, 2, 3, 4]

let user = { name: "Dev", age: 22 };
user.city = "Pune";
  • Must-know methods: push, pop, shift, unshift, map, filter, reduce
  • Destructuring simplifies access
const { name } = user;

7️⃣ Execution Context & Scope 🔍

function outer() {
  let a = 10;

  function inner() {
    console.log(a); // 10
  }

  inner();
}
outer();
  • Lexical scope & closures
  • Understand call stack, heap, and memory allocation

8️⃣ this, call, apply, bind 🤯

const obj = {
  name: "Dev",
  greet: function () {
    console.log(`Hello, ${this.name}`);
  },
};

obj.greet(); // Hello, Dev
  • Know how this behaves in different contexts
  • Use .call(), .apply(), .bind() to control this

9️⃣ DOM Manipulation 📱

const btn = document.getElementById("clickMe");
btn.addEventListener("click", () => {
  document.body.style.background = "lightblue";
});
  • Select, edit, and style HTML elements
  • Build interactivity in your frontend

🔟 ES6+ Features 💎

function greet(name = "Guest") {
  console.log(`Hello, ${name}`);
}

const user = { name: "Dev", age: 22 };
const { name, age } = user;
  • Default params ✅
  • Destructuring ✅
  • Spread/rest operators ✅

🔄 Asynchronous JavaScript ⏳

setTimeout(() => {
  console.log("Runs after 2s");
}, 2000);

// Promises
const fetchData = () =>
  new Promise((resolve, reject) => {
    resolve("Data fetched!");
  });

fetchData().then(console.log);
  • Learn setTimeout, Promises, async/await
  • Understand Event Loop, Web APIs, and Callbacks

👷 Prototype & OOP in JS

function Person(name) {
  this.name = name;
}

Person.prototype.sayHello = function () {
  console.log(`Hi, I'm ${this.name}`);
};

const user = new Person("Dev");
user.sayHello(); // Hi, I'm Dev
  • Constructor functions
  • Prototypes and inheritance
  • new keyword and how objects are created

📁 Bonus: My Practice Code

I’ve put all my examples in a GitHub repo for easy access:
🔗 https://github.com/Mahendra111111/Javascript_practiceset


👋 Final Words

JavaScript can feel overwhelming—but if you stick to what truly matters, you’ll get productive fast.