JavaScript Objects in Memory: Exploring Memory Management

JavaScript objects have a powerful feature called Prototype that enables inheritance. In JavaScript, if an object doesn’t have a specific property or method, the engine automatically looks for it in its prototype. This process continues up the prototype chain until the property is found or the chain ends. Example: function Person(name) { this.name = name; } Person.prototype.greet = function () { console.log("Hello, my name is " + this.name); }; const john = new Person("John"); john.greet(); Even though john doesn’t directly have the greet() method, it can still access it through Person.prototype. This mechanism allows JavaScript objects to share methods and inherit behavior efficiently. Understanding prototypes helps you better understand how inheritance and object behavior work behind the scenes in JavaScript. Follow for more JavaScript concepts explained visually. #javascript #webdevelopment #frontenddeveloper #coding #learninginpublic #100DaysOfCode

Today I explored one of the most confusing but fascinating concepts in JavaScript — The Event Loop. JavaScript is single-threaded, but it still handles asynchronous tasks like API calls, timers, and promises smoothly. The magic behind this is the Event Loop. Here’s the simple flow: 1️⃣ Call Stack – Executes synchronous code 2️⃣ Web APIs – Handles async tasks (setTimeout, fetch, DOM events) 3️⃣ Callback Queue / Microtask Queue – Stores callbacks waiting to execute 4️⃣ Event Loop – Moves tasks to the call stack when it’s empty 💡 Example: console.log("Start"); setTimeout(() => { console.log("Timeout"); }, 0); Promise.resolve().then(() => { console.log("Promise"); }); console.log("End"); 🧠 Output: Start End Promise Timeout Why? Because Promises go to the Microtask Queue which runs before the Callback Queue. ✨ Learning this helped me finally understand how JavaScript manages async behavior without multi-threading. Tomorrow I plan to explore another interesting JavaScript concept! Devendra Dhote Ritik Rajput #javascript #webdevelopment #frontenddeveloper #100DaysOfCode #learninginpublic #codingjourney #sheryianscodingschool

💻 JavaScript Practice: Merging Two Arrays Using a While Loop Today I practiced an important JavaScript concept — merging two arrays using a while loop. It’s a great exercise to improve logical thinking and understand how loops and indexes work together. Instead of using built-in methods like concat() or the spread operator, I tried doing it manually with a while loop. This helps in understanding how data moves step by step inside arrays. Key Idea: Start with two arrays. Use a while loop to iterate through them. Push elements into a new array until all elements are merged. Example: let arr1 = [1, 2, 3]; let arr2 = [4, 5, 6];then let result = [1,2,3,4,5,6] Practicing these small problems helps build a stronger foundation in JavaScript logic and problem-solving. 🚀 #JavaScript #DSA #WebDevelopment #CodingPractice #FrontendDevelopment 😊

🚀 JavaScript Prototypes Explained (Beyond “Classes”) Spent time breaking down how JavaScript actually handles inheritance under the hood. Here’s the mental model that made everything click 👇 🧠 Core Concepts: • Prototype Chain (object → parent → null) • Shared vs Instance Properties • What new actually does internally • Object.create() for manual inheritance • ES6 Classes & Static Methods 💡 Key Insight: class in JavaScript is just syntactic sugar over prototypes. Once you understand prototypes, inheritance is no longer a black box. 💻 Pattern-Based Problem Solving Focused on writing optimal solutions: • Maximum Subarray → Kadane’s Algorithm (O(n)) • Product of Array Except Self → Prefix/Suffix (O(n)) • Majority Element → Boyer–Moore (O(1) space) Instead of solving randomly, approached problems through patterns. 💡 Takeaway: When the pattern is clear, the problem becomes simple. Building a deeper understanding of how JavaScript really works — not just how to use it. 💪 #JavaScript #DSA #WebDevelopment #ProblemSolving #FrontendDeveloper #MERNStack Prototype Chain flow 👇

🧠 Ever wondered how JavaScript keeps track of which function is running? JavaScript uses something called the Call Stack. Think of it like a stack of tasks where functions are added and removed as they execute. 🔹 How the Call Stack Works JavaScript follows a Last In, First Out (LIFO) rule. That means: The last function added to the stack is the first one to finish. Example function first() { second(); } function second() { third(); } function third() { console.log("Hello from third function"); } first(); What happens in the Call Stack 1️⃣ first() is pushed to the stack 2️⃣ second() is called → pushed to the stack 3️⃣ third() is called → pushed to the stack 4️⃣ third() finishes → removed from stack 5️⃣ second() finishes → removed 6️⃣ first() finishes → removed 🔹 Visualising the Stack Call Stack at peak: - third() - second() - first() - Global() Then it unwinds back to the Global Execution Context. 💡 Why This Matters Understanding the call stack helps you understand: - Execution order - Stack overflow errors - Debugging JavaScript - Async behaviour It’s one of the core mechanics of the JavaScript engine. Next post: The Event Loop 🚀 #JavaScript #CallStack #Frontend #WebDevelopment #LearnJS #Programming #LearningInPublic

Day 4 of 30 Days of JavaScript💻....#JavaScript30 Today’s focus was on working with some of the most powerful and commonly used JavaScript array methods: 1 . filter() Used to extract specific data from arrays based on conditions. 2 . map() Learned how to transform array data into a new format. 3 . sort() Sorted complex datasets like objects and strings alphabetically and numerically. 4 . reduce() Takes an array and reduces it into one final result. Through these exercises, I understood how JavaScript can process datasets efficiently using clean and readable functional-style code. Working through these concepts step by step is helping me strengthen my logic and gain more confidence in writing JavaScript, which will definitely support me in frontend development and problem solving. #JavaScript #WebDevelopment #LearningInPublic #CodingJourney #FrontendDevelopment #30DaysOfCode

🚀 JavaScript Variables (var, let, const) & Hoisting. Before JavaScript executes your code… Have you ever wondered where variables are stored? 🤔 🧠 What is a Variable? A variable is a named container used to store data. ⚙️ JavaScript gives us 3 ways to declare variables: var a = 10; let b = 20; const c = 30; 🧠 What is Hoisting? 👉 Hoisting is JavaScript’s behavior of moving declarations to the top of their scope before execution. 👉 In simple words: You can access variables and functions even before they are initialized. 📦 Example with var: console.log(x); // undefined var x = 5; 🚫 Example with let: console.log(y); // ❌ ReferenceError let y = 10; 🔒 Same with const: console.log(z); // ❌ ReferenceError const z = 15; 🎯 Key Differences: • var → hoisted + initialized (undefined) • let & const → hoisted but NOT initialized (Temporal Dead Zone) 👉 “In the next post, we’ll dive into Scope — the concept that truly defines how variables behave in JavaScript.” #JavaScript #WebDevelopment #Frontend #Coding

Today I learned about one of the most important concepts in JavaScript: The Event Loop. JavaScript is single-threaded, which means it can run only one task at a time. But it can still handle asynchronous operations like timers, API calls, and user events. This is possible because of the Event Loop. 💡 How it works: 1️⃣ Call Stack – Executes JavaScript code 2️⃣ Web APIs – Handles async tasks like setTimeout, fetch, DOM events 3️⃣ Callback Queue – Stores completed async callbacks 4️⃣ Event Loop – Moves tasks from the queue to the stack when it’s empty Example: console.log("Start"); setTimeout(() => { console.log("Timer"); }, 2000); console.log("End"); Output: Start End Timer The timer runs later because it goes through the Event Loop system. Understanding the event loop helps in writing better async JavaScript and debugging complex behavior. Day 5 of my 21 Days JavaScript Concept Challenge 🚀 #JavaScript #WebDevelopment #FrontendDeveloper #AsyncJavaScript #LearningInPublic

🚀 Day 85 of My #100DaysOfCode Challenge One of the most confusing things in JavaScript is the "this" keyword. Many developers think "this" always refers to the current object… but that’s not always true. In JavaScript, the value of "this" depends on how a function is called, not where it is written. Let’s see a quick example 👇 const user = { name: "Tejal", greet() { console.log(this.name); } }; user.greet(); ✅ Output Tejal Here "this" refers to the object that called the function. But look at this 👇 const user = { name: "Tejal", greet: () => { console.log(this.name); } }; user.greet(); ❌ Output undefined Why? Because arrow functions don’t create their own "this". They inherit "this" from the surrounding scope. ⚡ Simple rule to remember • Regular functions → "this" depends on how the function is called • Arrow functions → "this" comes from the outer scope Understanding this small concept can save hours of debugging in real projects. JavaScript keeps reminding me that small details often make the biggest difference. #Day85 #100DaysOfCode #JavaScript #CodingJourney #WebDevelopment #LearningInPublic

🚀 Today’s JavaScript Practice: Merging Two Arrays Using a For Loop Today I practiced how to merge two arrays in JavaScript using a for loop instead of built-in methods. This helped me better understand how array indexing and loops work internally. 🔹 First, I created two arrays with some numbers. 🔹 Then I used a for loop to copy elements from the first array into a new array. 🔹 After that, I used another for loop to add elements of the second array after the first array’s elements. 💻 Example idea: data1 = [10,20,30,40,50] data2 = [60,70,80,90,100] ✅ Result → [10,20,30,40,50,60,70,80,90,100] You can also check my GitHub profile for more practice projects and code. #DSA #JavaScript #WebDevelopment #CodingPractice 😊