Understanding JavaScript Property Classification

💭 What do you think — will this effect run on every click? const Counter = () => { const [count, setCount] = React.useState(0); const config = { theme: "dark" }; React.useEffect(() => { console.log("Effect ran"); }, [config]); return <button onClick={() => setCount(count + 1)}>Click</button>; }; At first glance, config looks static. But… this effect will run on every single click 🧨 Let’s break down why — from JavaScript memory to React Fiber internals 👇 🧠 1. JS Basics — Reference Types In JavaScript, objects & functions are reference types — compared by memory address, not content. { a: 1 } === { a: 1 } // false () => {} === () => {} // false Every render recreates: const config = { theme: "dark" } → a new object in memory → a new reference. ⚛️ 2. Under the Hood — React Fiber When setCount triggers a re-render: React creates a new Fiber node for the current render. The previous Fiber is kept as the alternate. React compares them during reconciliation. 🔄 3. Effect Dependency Comparison React checks dependencies via: Object.is(prevDep, nextDep) Since each render creates a new config reference, the comparison fails → effect runs again. 🧩 Render 1 → config ref#1 Render 2 → config ref#2 → Object.is(ref#1, ref#2) → false → Effect runs ⚡️ 🧘♂️ 4. The Fix To prevent unnecessary re-runs, stabilize the reference: const config = React.useMemo(() => ({ theme: "dark" }), []); Or, if it’s static, define it outside the component: const config = { theme: "dark" }; ✅ Summary Each render → new Fiber node New objects/functions → new references React compares deps via Object.is(prev, next) Different refs = effect re-runs Use useMemo / useCallback to stabilize references 🔍 Takeaway: Every render isn’t just new JSX — it’s new memory, new references, and a new Fiber snapshot. Understanding that is what separates debugging React from mastering it. 🚀

🔍 𝗪𝗵𝗮𝘁 𝗶𝘀 𝗛𝗼𝗶𝘀𝘁𝗶𝗻𝗴? Hoisting is JavaScript’s default behavior of 𝗺𝗼𝘃𝗶𝗻𝗴 𝗱𝗲𝗰𝗹𝗮𝗿𝗮𝘁𝗶𝗼𝗻𝘀 (𝗻𝗼𝘁 𝗶𝗻𝗶𝘁𝗶𝗮𝗹𝗶𝘇𝗮𝘁𝗶𝗼𝗻𝘀) 𝘁𝗼 𝘁𝗵𝗲 𝘁𝗼𝗽 𝗼𝗳 𝘁𝗵𝗲𝗶𝗿 𝘀𝗰𝗼𝗽𝗲 𝗯𝗲𝗳𝗼𝗿𝗲 𝗰𝗼𝗱𝗲 𝗲𝘅𝗲𝗰𝘂𝘁𝗶𝗼𝗻. In simpler terms — during the compilation phase, JavaScript "scans" your code and allocates memory for variables and function declarations before executing it. That’s why you can use certain functions or variables before they’re defined in your code! 📘 𝗘𝘅𝗮𝗺𝗽𝗹𝗲: 𝗩𝗮𝗿𝗶𝗮𝗯𝗹𝗲 𝗛𝗼𝗶𝘀𝘁𝗶𝗻𝗴 console.log(myVar); // Output: undefined var myVar = 10; Behind the scenes, JavaScript treats this like: var myVar; // Declaration hoisted console.log(myVar); // undefined myVar = 10; // Initialization happens here ➡️ var is hoisted and initialized with undefined. However, if you use let or const, they’re hoisted too — but not initialized, leading to a ReferenceError if accessed before declaration. console.log(myLet); // ❌ ReferenceError let myLet = 20; ⚙️ 𝗘𝘅𝗮𝗺𝗽𝗹𝗲: 𝗙𝘂𝗻𝗰𝘁𝗶𝗼𝗻 𝗛𝗼𝗶𝘀𝘁𝗶𝗻𝗴 sayHello(); // ✅ Works! function sayHello() {  console.log("Hello, World!"); } ➡️ Function declarations are hoisted completely (both the name and definition). But function expressions are not fully hoisted: sayHi(); // ❌ TypeError: sayHi is not a function var sayHi = function() {  console.log("Hi!"); }; 💡 𝗪𝗵𝘆 𝗛𝗼𝗶𝘀𝘁𝗶𝗻𝗴 𝗠𝗮𝘁𝘁𝗲𝗿𝘀 𝟭. 𝗨𝗻𝗱𝗲𝗿𝘀𝘁𝗮𝗻𝗱𝗶𝗻𝗴 𝗘𝘅𝗲𝗰𝘂𝘁𝗶𝗼𝗻 𝗖𝗼𝗻𝘁𝗲𝘅𝘁: Helps you reason about how JS interprets and runs your code. 𝟮. 𝗔𝘃𝗼𝗶𝗱 𝗕𝘂𝗴𝘀: Prevents confusion around “undefined” or “ReferenceError”. 𝟯. 𝗜𝗻𝘁𝗲𝗿𝘃𝗶𝗲𝘄 𝗔𝗱𝘃𝗮𝗻𝘁𝗮𝗴𝗲: Hoisting is a frequent JS interview question — understanding it deeply gives you an edge. 🧠 𝗧𝗼𝗽 𝗜𝗻𝘁𝗲𝗿𝘃𝗶𝗲𝘄 𝗤𝘂𝗲𝘀𝘁𝗶𝗼𝗻 #𝟮 Q: What is Hoisting in JavaScript, and how does it affect variable and function declarations? A: Hoisting is JavaScript’s behavior of moving declarations to the top of their scope before execution. var is hoisted and initialized with undefined. let and const are hoisted but not initialized (Temporal Dead Zone). Function declarations are fully hoisted, while function expressions are not. 🎯 𝗞𝗲𝘆 𝗧𝗮𝗸𝗲𝗮𝘄𝗮𝘆𝘀 1. JavaScript hoists declarations, not initializations. 2. var behaves differently from let and const. 3. Function declarations can be used before they’re defined — but function expressions cannot. #JavaScript #Hoisting #WebDevelopment #InterviewPreparation #TechTips #JavaScriptInterviewQuestions

95% of developers can't explain how JavaScript actually executes code. If you don't understand the Event Loop, you don't really understand JavaScript. ➤ The Complete JavaScript Event Loop Architecture 𝗧𝗵𝗲 𝗖𝗮𝗹𝗹 𝗦𝘁𝗮𝗰𝗸: 1. Last-In-First-Out (LIFO) data structure 2. Holds currently executing function contexts 3. When function is called, it's pushed to stack 4. When function returns, it's popped from stack 5. JavaScript is single-threaded - one call stack only 𝗪𝗲𝗯 𝗔𝗣𝗜𝘀 (𝗕𝗿𝗼𝘄𝘀𝗲𝗿 𝗣𝗿𝗼𝘃𝗶𝗱𝗲𝗱): 6. setTimeout/setInterval - Timer APIs 7. fetch/XMLHttpRequest - Network requests 8. DOM events - Click, scroll, keyboard events 9. Promise resolution - Handled by browser 10. These run OUTSIDE JavaScript engine 𝗧𝗵𝗲 𝗤𝘂𝗲𝘂𝗲𝘀: 11. Callback Queue (Task Queue/Macrotask Queue)   - setTimeout/setInterval callbacks   - DOM event callbacks   - I/O operations 12. Microtask Queue (Job Queue)   - Promise .then/.catch/.finally   - queueMicrotask()   - MutationObserver callbacks 13. Animation Frame Queue   - requestAnimationFrame callbacks 𝗧𝗵𝗲 𝗘𝘃𝗲𝗻𝘁 𝗟𝗼𝗼𝗽 𝗣𝗿𝗼𝗰𝗲𝘀𝘀: 14. Check if call stack is empty 15. If not empty, continue executing current code 16. If empty, check Microtask Queue FIRST 17. Execute ALL microtasks until queue is empty 18. Render updates if needed (60fps target) 19. Check Callback Queue (Macrotask Queue) 20. Execute ONE macrotask 21. Go back to step 14 (repeat forever) 𝗣𝗿𝗶𝗼𝗿𝗶𝘁𝘆 𝗢𝗿𝗱𝗲𝗿: 22. Synchronous code (executes immediately) 23. Microtasks (Promises, queueMicrotask) 24. Animation frames (requestAnimationFrame) 25. Macrotasks (setTimeout, setInterval) 𝗖𝗼𝗺𝗺𝗼𝗻 𝗠𝗶𝘀𝘂𝗻𝗱𝗲𝗿𝘀𝘁𝗮𝗻𝗱𝗶𝗻𝗴𝘀: 26. setTimeout(fn, 0) is NOT instant - it's minimum 0ms 27. Promises are NOT asynchronous - their resolution is 28. async/await is just syntactic sugar over Promises 29. Event loop never stops - it runs continuously 30. Blocking code blocks EVERYTHING (avoid long tasks) 𝗥𝗲𝗮𝗹-𝗪𝗼𝗿𝗹𝗱 𝗜𝗺𝗽𝗹𝗶𝗰𝗮𝘁𝗶𝗼𝗻𝘀: 31. Heavy computation blocks UI updates 32. Use Web Workers for CPU-intensive tasks 33. Break large tasks into chunks with setTimeout 34. Promises always execute before setTimeout 35. Understanding this helps debug race conditions Master the Event Loop and 90% of JavaScript mysteries disappear. Keep learning, keep practicing, and stay ahead of the competition.

95% of developers can't explain how JavaScript actually executes code. If you don't understand the Event Loop, you don't really understand JavaScript. ➤ The Complete JavaScript Event Loop Architecture 𝗧𝗵𝗲 𝗖𝗮𝗹𝗹 𝗦𝘁𝗮𝗰𝗸: 1. Last-In-First-Out (LIFO) data structure 2. Holds currently executing function contexts 3. When function is called, it's pushed to stack 4. When function returns, it's popped from stack 5. JavaScript is single-threaded - one call stack only 𝗪𝗲𝗯 𝗔𝗣𝗜𝘀 (𝗕𝗿𝗼𝘄𝘀𝗲𝗿 𝗣𝗿𝗼𝘃𝗶𝗱𝗲𝗱): 6. setTimeout/setInterval - Timer APIs 7. fetch/XMLHttpRequest - Network requests 8. DOM events - Click, scroll, keyboard events 9. Promise resolution - Handled by browser 10. These run OUTSIDE JavaScript engine 𝗧𝗵𝗲 𝗤𝘂𝗲𝘂𝗲𝘀: 11. Callback Queue (Task Queue/Macrotask Queue) - setTimeout/setInterval callbacks - DOM event callbacks - I/O operations 12. Microtask Queue (Job Queue) - Promise .then/.catch/.finally - queueMicrotask() - MutationObserver callbacks 13. Animation Frame Queue - requestAnimationFrame callbacks 𝗧𝗵𝗲 𝗘𝘃𝗲𝗻𝘁 𝗟𝗼𝗼𝗽 𝗣𝗿𝗼𝗰𝗲𝘀𝘀: 14. Check if call stack is empty 15. If not empty, continue executing current code 16. If empty, check Microtask Queue FIRST 17. Execute ALL microtasks until queue is empty 18. Render updates if needed (60fps target) 19. Check Callback Queue (Macrotask Queue) 20. Execute ONE macrotask 21. Go back to step 14 (repeat forever) 𝗣𝗿𝗶𝗼𝗿𝗶𝘁𝘆 𝗢𝗿𝗱𝗲𝗿: 22. Synchronous code (executes immediately) 23. Microtasks (Promises, queueMicrotask) 24. Animation frames (requestAnimationFrame) 25. Macrotasks (setTimeout, setInterval) 𝗖𝗼𝗺𝗺𝗼𝗻 𝗠𝗶𝘀𝘂𝗻𝗱𝗲𝗿𝘀𝘁𝗮𝗻𝗱𝗶𝗻𝗴𝘀: 26. setTimeout(fn, 0) is NOT instant - it's minimum 0ms 27. Promises are NOT asynchronous - their resolution is 28. async/await is just syntactic sugar over Promises 29. Event loop never stops - it runs continuously 30. Blocking code blocks EVERYTHING (avoid long tasks) 𝗥𝗲𝗮𝗹-𝗪𝗼𝗿𝗹𝗱 𝗜𝗺𝗽𝗹𝗶𝗰𝗮𝘁𝗶𝗼𝗻𝘀: 31. Heavy computation blocks UI updates 32. Use Web Workers for CPU-intensive tasks 33. Break large tasks into chunks with setTimeout 34. Promises always execute before setTimeout 35. Understanding this helps debug race conditions Keep learning, keep practicing #JavaScript #WebDevelopment #Frontend #CodingInterview #ReactJS #AsyncProgramming #DataStructures #CodeOptimization #TechCareers #LearnToCode #InterviewPrep #UIDevelopment #DevCommunity #SoftwareEngineering

🔥 Mastering Virtual DOM and Components🔥 🧾 Definition: The Virtual DOM (VDOM) is a lightweight copy of the real DOM kept in memory . React uses it to update only the parts of the UI that change, instead of re-rendering the whole page. 💡 Key Concept: - React keeps a virtual representation of the UI in memory 🧠   - When state/props change, a new Virtual DOM is created 🔁   - React compares the new and old Virtual DOMs ⚖️   - Only the changed parts update in the real DOM 🚀 💻 JSX (JavaScript XML) JSX is a syntax extension for JavaScript that allows writing HTML-like code inside React components. ⚙️ Example: const name = "Vinod"; const element = <h1>Hello, {this.name}</h1>;  What are Components? A component in React is a reusable, independent piece of UI that returns JSX to describe how a part of the interface should look and behave. 🔁 Real-World Analogy: Think of components as Lego blocks — you combine small pieces (components) to build a large structure (application). Types of Components React has two main types of components: i. Class Components A Class Component is a JavaScript class that extends React.Component and includes a render() method that returns JSX. ⚙️ Example: import React from 'react'; class Welcome extends React.Component { name = "tom";   render() {     return <h1>Hello {this.name}</h1>;   } } export default Welcome; ii. Functional Components A Functional Component is a JavaScript function that returns JSX. It’s a simple and declarative way to define components. ⚙️ Example: function Welcome() {   const name = "tom";   return <h1>Hello {name}</h1>; } Creating and Rendering Components ⚙️ Example: // App . jsx import React from 'react'; import Welcome from './Welcome'; function App() {   return (     <div>       <h1>Main Component</h1>       <Welcome />     </div>   ); } export default App; - Here, <Welcome /> is a child component inside the App component. - Components must start with a capital letter (React uses this to differentiate components from HTML tags). 💬 Takeaway: Virtual DOM makes React fast ⚡ and Components make it modular 🧩. Together, they make front-end development cleaner, faster, and easier to scale. Sharath Eppalapally

💛 #JSMadeEasy with Virashree When I first heard about “Hoisting” in JavaScript, I thought it had something to do with lifting variables up 🏋️♀️😂 Turns out… I wasn’t entirely wrong! - Here’s a simple way to understand what Hoisting really means 👇 🧠 What is Hoisting? - When JavaScript runs your code, it does it in two phases: 1️⃣ 𝗠𝗲𝗺𝗼𝗿𝘆 𝗖𝗿𝗲𝗮𝘁𝗶𝗼𝗻 𝗣𝗵𝗮𝘀𝗲 — where it scans and “remembers” all variables and functions 2️⃣ 𝗘𝘅𝗲𝗰𝘂𝘁𝗶𝗼𝗻 𝗣𝗵𝗮𝘀𝗲 — where it actually runs the code line by line - In the first phase, JS “hoists” (lifts) all variable and function declarations to the top of their scope. 💻 Example 1: Using var console.log(name); // undefined var name = "Virashree"; JS internally does this 👇 var name; // declaration hoisted console.log(name); // undefined name = "Virashree"; - So, name exists in memory but has no value yet — hence undefined. 🌿 Example 2: Using let and const console.log(age); // ❌ ReferenceError let age = 24; - Unlike var, let and const are hoisted too — but they stay in a special zone called the 𝗧𝗲𝗺𝗽𝗼𝗿𝗮𝗹 𝗗𝗲𝗮𝗱 𝗭𝗼𝗻𝗲 (𝗧𝗗𝗭) until they’re declared. - That’s why accessing them before declaration throws an error instead of showing undefined. ⚙️ Function Hoisting — Two Types In JavaScript, there are two main ways to create functions: 1️⃣ Function Declaration 2️⃣ Function Expression - And they behave very differently when it comes to hoisting 👇 🌿 1. 𝗙𝘂𝗻𝗰𝘁𝗶𝗼𝗻 𝗗𝗲𝗰𝗹𝗮𝗿𝗮𝘁𝗶𝗼𝗻 — Fully Hoisted ✅ The whole function is hoisted to the top of its scope. So you can call it before it’s defined. greet(); // ✅ Works fine function greet() {  console.log("Hello, Virashree!"); } ➡️ Output: Hello, Virashree! Because JS hoists both the name and the body of the function. 🌸 2. 𝗙𝘂𝗻𝗰𝘁𝗶𝗼𝗻 𝗘𝘅𝗽𝗿𝗲𝘀𝘀𝗶𝗼𝗻 — NOT Fully Hoisted When you assign a function to a variable (using var, let, or const), only the variable name is hoisted — not the function itself. sayHi(); // ❌ TypeError var sayHi = function() {  console.log("Hi there!"); }; - If you used var, you’ll get: ❌ TypeError: sayHi is not a function - If you used let or const, you’ll get: ❌ ReferenceError: Cannot access 'sayHi' before initialization - So basically: 🚫 The variable gets hoisted, but the actual function definition does not. 🧩 Quick Recap var      → Hoisted ✅ | Value: undefined let      → Hoisted ✅ | Value: ❌ ReferenceError (TDZ) const     → Hoisted ✅ | Value: ❌ ReferenceError (TDZ) function decl → ✅ Fully hoisted function expr → ⚠️ Partially hoisted (variable only) 🧠 Takeaway - So next time your code throws “is not a function,” - check how you declared it — not where! 😉 💬 Question for you: Which one confused you more — function declarations or function expressions? Comment below and I’ll break it down in my next #javascript #frontenddevelopment #webdevelopment #reactjs #learninginpublic #womenintech

⚡After DOM, I Moved Into One of the Most Overlooked Yet Powerful JS Topics: Numbers & Math 🔢 Hello everyone 👋 After getting comfortable with DOM Manipulation and interactive UI building, I decided to shift my focus toward a smaller—but extremely important—foundation of JavaScript: the Number Object and the Math Object. These two are essential for validations, calculations, rounding, randomization, and writing logic that behaves consistently across different scenarios. 💡 Understanding the Number Object JavaScript uses only one number type, but the Number object provides several helpful tools around it. 🔸 Key Number Properties Number.MAX_VALUE — Largest number JavaScript can handle Number.MIN_VALUE — Smallest Number.POSITIVE_INFINITY / NEGATIVE_INFINITY Number.NaN — Represents “Not a Number” (common in input validation) 🔸 Useful Number Methods toString() → Convert number to string toFixed(n) → Round to n decimals (useful for currency/UI precision) toPrecision(n) → Limit total digits parseInt() / parseFloat() → Extract usable numbers from strings isNaN() / isFinite() → Validate if a value is truly numeric 👉 Quick Tip: parseInt("42px") reads until it hits a non-number character — returning 42. 🧠 The Math Object — JavaScript’s Built-In Calculator Unlike Number, the Math object is static. You directly call its methods for calculations and transformations. 🔸 Must-Know Math Methods Math.round() → Nearest integer Math.floor() → Round down Math.ceil() → Round up Math.trunc() → Remove decimal part Math.pow(a, b) → a^b Math.sqrt() → Square root Math.abs() → Absolute value Math.min() / Math.max() Math.random() → Random number (0–1) 🎲 Example: Random integer (1 to 10) Math.floor(Math.random() * 10) + 1; 🧩 Key Takeaways 1️⃣ JavaScript has just one number type — knowing these methods is essential. 2️⃣ Math.random() + Math.floor() → best combo for generating random integers. 3️⃣ Always check invalid inputs using isNaN() before performing calculations. 4️⃣ Use toFixed() when working with decimals or UI formatting. 5️⃣ Math.trunc() is the cleanest way to get just the integer part. Exploring these objects helped me write more reliable, controlled, and error-free logic — especially for projects involving calculations or user inputs. 💬 Question for You Which Number or Math method do you use the most in your projects? Math.random()? toFixed()? Something else? Share your thoughts below! 👇 #JavaScript #WebDevelopment #MathObject #NumberObject #FrontendDevelopment #CodingJourney #LearnInPublic #JSFundamentals

Variables in JavaScript In JavaScript, variables can be declared using var, let, or const. 1. var – Function Scoped The var keyword was the original way to declare variables in JavaScript. A variable declared with var is function-scoped, meaning it can be accessed anywhere inside the function where it is defined — even outside of a block like an if statement. Example: function testVar() { if (true) { var message = "Hello, world!"; // declared with var } console.log(message); // accessible here because var is function-scoped } testVar(); // Output: "Hello, world!" Here, the variable message is accessible outside the if block because var does not have block scope—it only respects function boundaries. 2. let and const – Block Scoped Introduced in ES6 (ECMAScript 2015), both let and const are block-scoped. That means variables declared with these keywords can only be accessed within the block { } where they are defined. let allows you to reassign the variable later. const creates a read-only (constant) variable that cannot be reassigned once set. Example: function testBlockScope() { if (true) { let name = "Adnan"; // block-scoped const age = 25; // block-scoped and read-only console.log(name, age); // Accessible here → Adnan 25 } // console.log(name); // Error! 'name' is not defined outside the block // console.log(age); // Error! 'age' is not defined outside the block } testBlockScope(); In this case, name and age are not accessible outside the if block because both let and const follow block scope rules.

⚙️✨ Mastering Hoisting in JavaScript — The Hidden Execution Magic! Ever wondered how JavaScript seems to “know” about your functions and variables even before they’re written in the code? 🤔 That secret superpower is called Hoisting 🚀 Let’s break it down in a way you’ll never forget 👇 💡 What is Hoisting? Hoisting is JavaScript’s default behavior of moving all declarations (variables and functions) to the top of their scope before the code executes. 👉 In simple words: You can use functions and variables before declaring them (but with rules!). 🧠 How It Works Before your code runs, JavaScript goes through two phases: 1️⃣ Creation Phase: It scans the code and allocates memory for variables and functions. Variables declared with var are set to undefined. let and const are placed in a Temporal Dead Zone (TDZ) until initialized. Function declarations are fully hoisted (you can call them before definition). 2️⃣ Execution Phase: Code runs line by line. Variables and functions are assigned actual values. 🧩 Example 1 – Variable Hoisting console.log(a); // undefined var a = 10; console.log(b); // ❌ ReferenceError let b = 20; ✅ var is hoisted and initialized as undefined. ❌ let is hoisted but not initialized — accessing it before declaration causes an error. ⚡ Example 2 – Function Hoisting greet(); // ✅ Works! function greet() { console.log("Hello, World!"); } sayHi(); // ❌ Error var sayHi = function() { console.log("Hi there!"); }; ✅ Function declarations are fully hoisted. ❌ Function expressions (including arrow functions) behave like variables — not hoisted with values. 🧩 Quick Explanation: Hoisting means the declaration is moved to the top of its scope (not the initialization). TDZ (Temporal Dead Zone) — the time between hoisting and actual declaration, where access causes an error. var gets hoisted and initialized with undefined. let and const get hoisted but stay uninitialized until the declaration line is executed. Functions declared using function keyword are fully hoisted (you can call them before they are defined). 🪄 Example 3 – The Complete Picture console.log(x); // undefined var x = 5; hello(); // ✅ Works function hello() { console.log("Hello JS!"); } sayHi(); // ❌ Error let sayHi = () => console.log("Hi JS!"); 💬 In Short: 🧩 Hoisting means declarations are processed first, execution happens later. 🚀 Functions are hoisted completely, variables only partially. ⚠️ let and const live in the Temporal Dead Zone until declared. 💭 Pro Tip: Understanding hoisting helps you avoid confusing bugs and makes you a more confident JavaScript developer 💪 💻 JavaScript reads your code twice — first to hoist, then to execute! Once you master this concept, debugging becomes much easier 😎 #JavaScript #WebDevelopment #ReactJS #Frontend #CodingTips #LearnCoding #Programming #DeveloperJourney

If you call yourself a JavaScript developer,then these are the concepts you must be aware of Knowing just the basics won't cut it anymore. Here’s a roadmap of concepts I believe every developer should master: 1. Array Buffer & Typed Arrays 2. Array Destructuring 3. Array Methods (map, filter & more) 4. Arrow Functions Vs. Regular Functions 5. Async / Await 6. Bitwise Operators 7. call(), apply(), bind() 8. Callbacks 9. Canvas API 10. Clean Code Practices in JavaScript 11. Client-Side Routing 12. Closures 13. Code Splitting 14. Cross-Browser Compatibility 15. Cross-Origin Resource Sharing (CORS) 16. Currying 17. Custom Events 18. Debounce vs Throttle 19. Debouncing and Throttling 20. Deep vs. Shallow Copy 21. Design Patterns (Observer, Singleton, Factory, etc.) 22. Destructuring 23. Destructuring Assignment 24. Destructuring Nested Objects/Arrays 25. DOM Manipulation 26. Dynamic Imports 27. Dynamic Typing 28. Equality Operators (== vs ===) 29. Error Boundaries (in React.js) 30. Error Handling (Try/Catch/Throw) 31. ES6 Features (Arrow Functions, Classes, Modules, Destructuring) 32. Event Bubbling and Capturing 33. Event Delegation 34. Event Handling (addEventListener) 35. Event Loop 36. Fetch API 37. Functions 38. Generator Functions 39. Geolocation API 40. Geolocation vs Location Services 41. Global and Local Object (window, globalThis) 42. Hoisting 43. IIFE (Immediately Invoked Function Expression) 44. Inheritance (Class-based) 45. Intersection Observer API 46. JavaScript Memory Management (Garbage Collection) 47. JavaScript vs ECMAScript 48. JSON 49. Lazy Loading 50. Map and Set 51. Memoization 52. Methods 53. Module Pattern 54. Modules (Import/Export) 55. MutationObserver 56. NaN (Not a Number) 57. Object 58. Object Literal Shorthand 59. Object.assign() 60. Performance Optimization 61. Polyfills 62. Promise.all() 63. Promises 64. Prototypal Inheritance 65. RegEx (Regular Expressions) 66. Scope (Function vs Block Scope) 67. Service Workers 68. Set and Map Iteration 69. Set vs Map 70. SetTimeout and SetInterval 71. Shadow DOM 72. Template Literals 73. Shadowing 74. Spread & Rest Operators 75. Strict Mode 76. SVG Manipulation 77. Web Workers & WebSockets 78. This Keyword 79. Boolean Values 80. let, var & const 81. Type Coercion vs Type Conversion 82. URL API (URLSearchParams, URL objects) 83. WeakMap & WeakSet 84. Web Animations 85. localStorage & sessionStorage Built for you: For DSA Prep: ✅ Notes that are concise and clear ✅ Most-asked questions per topic ✅ Real patterns + approaches 👉 Grab the DSA Guide → https://lnkd.in/d8fbNtNv For ReactJS Prep: ✅ Handwritten notes ✅ Interview-focused ✅ Covers fundamentals 👉 Grab the React Guide → https://lnkd.in/dpDy_i2W 𝐅𝐨𝐫 𝐌𝐨𝐫𝐞 𝐃𝐞𝐯 𝐈𝐧𝐬𝐢𝐠𝐡𝐭𝐬 𝐉𝐨𝐢𝐧 𝐌𝐲 𝐂𝐨𝐦𝐦𝐮𝐧𝐢𝐭𝐲: Telegram → https://lnkd.in/d_PjD86B Whatsapp → https://lnkd.in/dvk8prj5 Built for devs who want to crack interviews