Mastering JavaScript Object Creation Methods

🔥 Day 13/100 — Mastering JavaScript Essentials 🚀 Today I revisited 3 absolute game-changers in JavaScript: map, filter, and reduce — the holy trinity of clean, functional code 💡 Here’s a quick breakdown 👇 ✨ map() — Transform Data Used when you want to modify every element in an array. 👉 Example: const nums = [1, 2, 3]; const squared = nums.map(n => n * n); // [1, 4, 9] 🧹 filter() — Select Data Used to keep only elements that match a condition. 👉 Example: const nums = [1, 2, 3, 4]; const evens = nums.filter(n => n % 2 === 0); // [2, 4] 🧠 reduce() — Aggregate Data Used to boil down an array into a single value. 👉 Example: const nums = [1, 2, 3, 4]; const sum = nums.reduce((acc, n) => acc + n, 0); // 10 💥 The real power? Combining them: const result = [1,2,3,4,5] .filter(n => n % 2 !== 0) .map(n => n * 2) .reduce((acc, n) => acc + n, 0); // Output: 18 ⚡ Cleaner code ⚡ Less loops ⚡ More readability It’s crazy how mastering these small concepts can level up your coding style BIG TIME 🚀 #100DaysOfCode #JavaScript #WebDevelopment #CodingJourney #Developers #LearnInPublic #Tech #Programming #LearningInPublic Sheryians Coding School Sheryians Coding School Community

🚀 JavaScript Simplified Series — Day 9 Functions are powerful… But JavaScript gives you even better ways to write them. 😎 Today let’s understand 3 important concepts that make your code clean, modern, and powerful: 👉 Arrow Functions 👉 Default Parameters 👉 Rest Parameters 🔹 1. Arrow Functions (Short & Clean) Earlier we used to write functions like this: function add(a, b) { return a + b } Now with arrow functions, we can write it in a cleaner way: const add = (a, b) => a + b 👉 Same result, less code 📌 Arrow functions make code short and readable 🔹 2. Default Parameters (No more undefined) Sometimes users don’t pass values 😵 function greet(name) { console.log("Hello " + name) } greet() 👉 Output: Hello undefined ❌ Solution → Default Parameters function greet(name = "Guest") { console.log("Hello " + name) } greet() 👉 Output: Hello Guest ✅ 📌 Default values prevent errors and make code safe 🔹 3. Rest Parameters (Handle multiple inputs) What if you don’t know how many inputs will come? 🤔 That’s where rest parameters come in. function sum(...numbers) { let total = 0 for (let num of numbers) { total += num } return total } console.log(sum(1, 2, 3, 4)) 👉 Output: 10 📌 ...numbers collects all values into an array 🔥 Simple Summary Arrow Function → short syntax Default Parameters → fallback values Rest Parameters → multiple inputs handle 💡 Programming Rule Write less code. Write clean code. Write smart code. If you want to learn JavaScript in a simple and practical way, you can follow these YouTube channels: • Rohit Negi • Hitesh Choudhary (Chai aur Code) 📌 Series Progress Day 1 → What is JavaScript Day 2 → Variables & Data Types Day 3 → Type Conversion & Operators Day 4 → Truthy & Falsy + Comparison Operators Day 5 → If Else + Switch + Ternary Day 6 → Loops Day 7 → Break + Continue + Nested Loops Day 8 → Functions Basics Day 9 → Arrow + Default + Rest Parameters Day 10 → Arrays (Next Post) Follow for more 🚀 #JavaScriptSimplified #javascript #webdevelopment #coding #programming #learninpublic #100DaysOfCode #frontenddevelopment #devcommunity #codingjourney #softwaredeveloper #techcommunity #dailylearning #codeeveryday

🚀 Day 35/50 – Mastering Loops in JavaScript Today I strengthened my understanding of Loops in JavaScript — one of the most important concepts for writing efficient and dynamic code. 🔁 What is a Loop? A loop is used to execute a block of code repeatedly until a condition is satisfied. 📌 Types of Loops in JavaScript: 1️⃣ for loop – Used when the number of iterations is known. for(let i = 1; i <= 5; i++){ console.log(i); } 2️⃣ while loop – Executes while the condition is true. let i = 1; while(i <= 5){ console.log(i); i++; } 3️⃣ do...while loop – Executes at least once before checking condition. let i = 1; do{ console.log(i); i++; }while(i <= 5); 4️⃣ for...of loop – Used for iterating over arrays. let arr = [10,20,30]; for(let value of arr){ console.log(value); } 5️⃣ for...in loop – Used for iterating over object properties. let obj = {name:"Priyanka", role:"Developer"}; for(let key in obj){ console.log(key, obj[key]); } 💡 Key Learnings: ✔ Loops help reduce code repetition ✔ Choosing the right loop improves performance & readability ✔ Understanding break and continue statements is essential Thanks for mentors 10000 Coders Raviteja T Mohammed Abdul Rahman #Day35 #50DaysOfCode #JavaScript #WebDevelopment #FrontendDeveloper #CodingJourney #LearningEveryday

💡 Understanding the JavaScript Event Loop (Made Simple) When I started learning JavaScript, I was confused about how setTimeout, button clicks, and API calls worked — especially since JavaScript is single-threaded. This visual really helped me understand what happens behind the scenes: 👉 1. Call Stack – Runs code line by line (synchronous code) 👉 2. Web APIs – Handles async tasks like timers and fetch requests 👉 3. Callback Queue – Stores completed async callbacks 👉 4. Event Loop – Moves callbacks to the stack when it’s empty 🔎 Simple Example: console.log("Start"); setTimeout(() => { console.log("Inside Timeout"); }, 0); console.log("End"); 👉 What do you think the output will be? The output is: Start End Inside Timeout Even though the timeout is set to 0 milliseconds, it doesn’t run immediately. Here’s why: 1️⃣ "Start" goes to the call stack → executes 2️⃣ setTimeout moves to Web APIs 3️⃣ "End" executes 4️⃣ The callback moves to the queue 5️⃣ The Event Loop waits until the stack is empty 6️⃣ Then it pushes "Inside Timeout" to the stack That’s the Event Loop in action 🚀 Understanding this concept made: ✅ Promises easier ✅ Async/Await clearer ✅ Debugging smoother If you're learning JavaScript, mastering the Event Loop is a big step forward. #JavaScript #WebDevelopment #BeginnerDeveloper #AsyncProgramming #FrontendDevelopment #mernstack #fullstack

🚨 JavaScript Objects looked simple… until I explored what’s actually happening behind the scenes. When I first started learning JavaScript, objects felt very straightforward — just {} and some key-value pairs. But today I spent time digging deeper into how JavaScript objects actually work, and I realized there's a lot more happening internally. Here are a few concepts that really stood out to me while learning 👇 💡 Object Literals – the simplest way to create objects let user = { name: "Pradeep", age: 21 }; 🧱 Constructor Functions (ES5) – useful when you want to create multiple objects with the same structure function User(name) { this.name = name; } 🔍 this Keyword – it refers to the object that is calling the function, which makes context very important in JavaScript. 🧬 Prototype – methods added to the prototype are shared across all instances created from the constructor. This helps save memory and avoid repeating the same functions for every object. ⚙️ Object.create() – allows you to create a new object using another object as its prototype. 🧠 Shallow Copy vs Deep Copy – something that confused me at first. Shallow copy: let copy = { ...obj }; Deep copy: let copy = JSON.parse(JSON.stringify(obj)); ⚠️ Important insight: A shallow copy only copies the first level. If the object contains nested objects, changes can still affect the original. Learning this made me realize that JavaScript objects are powered by a powerful prototype system, not just simple key-value storage. Still learning and exploring JavaScript fundamentals every day. 🚀 💬 What JavaScript concept took you the longest to understand? #javascript #webdevelopment #frontenddevelopment #codingjourney #softwaredevelopment #developers #programming #100daysofcode

Day 70 — JavaScript Learning 🚀 Today I revisited one of the most misunderstood topics in JavaScript — Hoisting. ❌ Myth: “JavaScript moves declarations to the top.” ✅ Reality: JavaScript doesn’t move your code. It creates memory for variables and functions during the creation phase. --- 🔹 Example 1 — var console.log(a); var a = 10; 👉 Output: undefined Why? During memory creation: a = undefined So it exists… but has no value yet. --- 🔹 Example 2 — let & const console.log(b); let b = 20; 👉 Output: ReferenceError This is because of the Temporal Dead Zone (TDZ). let and const are hoisted too — but they are not initialized. --- 🔹 Example 3 — Function Hoisting greet(); function greet() { console.log("Hello"); } 👉 Works perfectly. But: greet(); const greet = function() { console.log("Hello"); } 👉 Error ❌ Because function expressions follow variable rules. --- 📌 What I understood today: Hoisting is not about “moving code.” It’s about how JavaScript creates memory before execution. Understanding this removes so many beginner-level bugs. #Day70 #JavaScript #Hoisting #WebDevelopment #DeepLearning

🚀 Day 7/100 of #100DaysOfCode Today was all about strengthening JavaScript fundamentals — revisiting concepts that seem simple but are often misunderstood. 🔁 map() vs forEach() Both are used to iterate over arrays, but they serve different purposes: 👉 map() Returns a new array Used when you want to transform data Does not modify the original array Example: const doubled = arr.map(num => num * 2); 👉 forEach() Does not return anything (undefined) Used for executing side effects (logging, updating values, etc.) Often modifies existing data or performs actions Example: arr.forEach(num => console.log(num)); ⚔️ Key Difference: Use map() when you need a new transformed array Use forEach() when you just want to loop and perform actions ⚖️ == vs === (Equality in JS) 👉 == (Loose Equality) Compares values after type conversion Can lead to unexpected results Example: '5' == 5 // true 😬 👉 === (Strict Equality) Compares value AND type No type coercion → safer and predictable Example: '5' === 5 // false ✅ 💡 Takeaway: Small concepts like these make a big difference in writing clean, bug-free code. Mastering the basics is what separates good developers from great ones. 🔥 Consistency > Intensity On to Day 8! #JavaScript #WebDevelopment #CodingJourney #LearnInPublic #Developers #100DaysOfCode #SheryiansCodingSchool #Sheryians

Today I practiced an important JavaScript concept: Flattening a nested array manually using loops. Instead of using the built-in .flat() method, I implemented the logic myself to deeply understand how flattening actually works. 🧠 Problem Given this array: [1, [2, 3], [4, 5], 6] Return: [1, 2, 3, 4, 5, 6] 🔍 My Approach Created an empty result array. Looped through each element of the main array. Checked if the current element is an array using Array.isArray(). If it’s an array: Loop through it Push each inner element individually into result If it’s not an array: Push it directly into result 💡 Key Line That Does the Magic result.push(arr[i][j]); This line: Accesses elements inside the nested array Pushes them individually into the final result Removes one level of nesting 🎯 What I Learned How nested loops work in real problems The difference between pushing an array vs pushing its elements What “one-level flattening” actually means How .flat() works internally ⏱ Time Complexity O(n) — every element is visited once. Building fundamentals > memorizing shortcuts. Next step: Flatten deeply nested arrays using recursion 🔥 #JavaScript #FrontendDeveloper #ProblemSolving #WebDevelopment #100DaysOfCode #DSA #LearningInPublic

🚨 JavaScript Array Methods look simple… until they don’t. Most developers learn map(), filter(), and reduce() early. But when you actually practice them deeply, you start noticing small behaviors that can easily trip you up in interviews or real projects. Today I spent time revisiting these core methods, and a few surprisingly tricky edge cases stood out. Here are some that caught my attention 👇 ⚠️ 1️⃣ map() without a return [1,2,3].map(x => { x * 2 }) Output: [undefined, undefined, undefined] Why? Because when you use {} in arrow functions, you must explicitly return the value. ⚠️ 2️⃣ Thinking filter(x => x % 2) returns even numbers [1,2,3,4].filter(x => x % 2) Output: [1,3] Because: odd % 2 → 1 → true even % 2 → 0 → false So this actually returns odd numbers, not even ones. ⚠️ 3️⃣ Using map() when filter() is needed [1,2,3,4].map(x => { if(x % 2 === 0) return x; }) Output: [undefined, 2, undefined, 4] Because map() always keeps the same array length, even when nothing is returned. ⚠️ 4️⃣ The famous parseInt trap [1,2,3].map(parseInt) Output: [1, NaN, NaN] Why this happens: map() passes (element, index) to the callback. So it becomes: parseInt(1,0) parseInt(2,1) parseInt(3,2) Which leads to unexpected results. 💡 Big takeaway: Knowing JavaScript syntax is useful. But understanding how JavaScript actually behaves internally is what makes you a better developer. Small details like these often separate surface knowledge from real mastery. If you're learning JavaScript right now, try experimenting with these methods yourself. You’ll be surprised how much depth there is. 🚀 💬 Which JavaScript behavior confused you the most when you were learning? Let’s share and learn together. #javascript #webdevelopment #frontenddevelopment #softwareengineering #coding #programming #developers #100daysofcode #learninpublic #techcommunity #codingtips #javascriptdeveloper

🚀 Day 5 / 100 — JavaScript Concepts That Every Developer Should Understand #100DaysOfCode Today I revised two very important JavaScript concepts that often come up in interviews and real-world debugging: 🔐 1. Closures A closure happens when a function remembers variables from its outer scope even after the outer function has finished executing. In simple words: A function carries its environment with it. Example: function outer() { let count = 0; function inner() { count++; console.log(count); } return inner; } const counter = outer(); counter(); // 1 counter(); // 2 counter(); // 3 Why this works: Even though outer() has finished running, inner() still remembers the variable count. 📌 Common use cases • Data privacy • Function factories • React hooks • Event handlers 🧠 2. Call Stack The call stack is how JavaScript keeps track of function execution. It works like a stack (Last In, First Out). Whenever a function runs: 1️⃣ It gets pushed onto the stack 2️⃣ When it finishes, it gets popped off Example: function one() { two(); } function two() { three(); } function three() { console.log("Hello from the call stack"); } one(); Execution order in the call stack: Call Stack three() two() one() global() Then it unwinds after execution. 📌 Understanding the call stack helps with: • Debugging errors • Understanding recursion • Avoiding stack overflow 💡 Key realization today: JavaScript is single-threaded, and concepts like closures + call stack explain a lot about how the language actually works behind the scenes. Mastering these fundamentals makes async JS, promises, and the event loop much easier later. 🔥 Day 5 completed. 95 days to go. If you're also learning to code, comment “100” and let’s stay consistent together 🤝 #javascript #100daysofcode #webdevelopment #coding #developers #programming #learninpublic #buildinpublic #SheryiansCodingSchool #Sheryians