How to Deep Clone a Nested Object in JavaScript

JavaScript for 15 Days – Day 3: Data Types Every value in JavaScript has a data type, it tells the program what kind of data we’re working with. Today, you'll explore the difference between primitive and non-primitive data types, and how JavaScript uses them to store and process information. Primitive types: String, Number, Boolean, Null, Undefined, Symbol, BigInt Non-primitive types: Object, Array, Function Example 👇 let name = "Moussa"; // String let age = 27; // Number let skills = ["JS", "HTML", "CSS"]; // Array 💡 Lesson learned: Understanding data types makes debugging easier and helps you write cleaner, more reliable code. #JavaScript #FrontendDevelopment #WebDevelopment #CodingJourney #LearnToCode #15DaysJS #DevPerDay

🚀 Day 84/90 – #90DaysOfJavaScript Topic covered: Copying by Reference vs Value in JavaScript ✅ Reference vs Value 👉 Primitive types (string, number, boolean, etc.) are copied by value. 👉 Objects and arrays are copied by reference, meaning both variables point to the same memory. ✅ Copying Arrays 👉 Shallow Copy: Creates a new top-level array but shares nested references. 👉 Methods: slice(), spread ([...]), Array.from(). 👉 Deep Copy: Fully duplicates nested data. 👉 Methods: structuredClone(), JSON.parse(JSON.stringify()) (⚠️ limited for special data types). ✅ Copying Objects 👉 Assignment (=) copies the reference. 👉 Shallow Copy: Object.assign({}, obj) or {...obj} — nested objects still shared. 👉 Deep Copy:  👉 structuredClone(obj) ✅ 👉 JSON.parse(JSON.stringify(obj)) ⚠️ (loses functions, undefined, etc.) ✅ Key Takeaways 👉 Shallow copy affects nested objects/arrays. 👉 structuredClone() is the most reliable modern solution for deep cloning. 👉 Always choose cloning method based on data type and depth of structure. 🛠️ Access my GitHub repo for all code and explanations: 🔗 https://lnkd.in/d3J47YHj Let’s learn together! Follow my journey to #MasterJavaScript in 90 days! 🔁 Like, 💬 comment, and 🔗 share if you're learning too. #JavaScript #WebDevelopment #CodingChallenge #Frontend #JavaScriptNotes #MasteringJavaScript #GitHub #LearnInPublic

🚀 Day 42 of #100DaysOfWebDevelopment Challenge Today, I started learning one of the most important data structures in JavaScript — Arrays. Understanding arrays is essential for storing, managing, and manipulating multiple values efficiently. 🔹 Array Data Structure An array is a special type of object used to store ordered collections of data. Each element in an array has an index, starting from 0. Arrays can hold numbers, strings, objects, or even other arrays. 🔹 Visualizing Arrays I learned how arrays work internally — how elements are stored in sequence and can be accessed using their index positions. Example: arr[0] accesses the first element. 🔹 Mixed Arrays JavaScript allows mixed arrays, meaning an array can contain multiple data types at once (e.g., strings, numbers, booleans, or even functions). This flexibility makes it very versatile. 🔹 Mutability in Arrays Arrays in JavaScript are mutable, which means their elements can be changed even if the array itself is declared with const. Only the reference is constant, not the content. 🔹 Common Array Methods I also practiced some fundamental array methods: push() → adds an element at the end. pop() → removes the last element. shift() → removes the first element. unshift() → adds an element at the beginning. 💡 Key Takeaway: Arrays are the backbone of data manipulation in JavaScript. Learning how to manage and modify them effectively lays the groundwork for handling real-world data in applications. #100DaysOfCode #WebDevelopment #JavaScript #FrontendDevelopment #LearningInPublic #CodingJourney

#100DaysLearningChallenge with Saurabh Shukla Sir. 🎯 Day 19: Set in JavaScript — Ensuring Uniqueness and Efficiency 🔁✨ Yesterday, I worked with the Priority Queue, mastering how priorities influence data processing. Today, I explored another powerful built-in data structure — the Set — a simple yet efficient way to manage unique collections of values in JavaScript. 🧠 What’s a Set? A Set is a special type of collection that stores unique values, whether primitive types or object references. It automatically removes duplicates, making it a great tool for scenarios where uniqueness is essential. 🛠️ What I learned and implemented: ✅ Created and managed Sets to store unique data ✅ Added, deleted, and checked elements efficiently ✅ Explored key Set methods like add(), delete(), has(), and clear() ✅ Practiced converting between Arrays and Sets ✅ Used Sets to eliminate duplicates from arrays effortlessly 📂 Real-world use cases: ➡️ Removing duplicates from data collections ➡️ Managing unique user IDs or tokens ➡️ Tracking visited nodes in graph algorithms ➡️ Optimizing lookups and membership checks 👨💻 Sets may seem simple, but they play a crucial role in writing cleaner, faster, and more reliable code. 📒 Try creating your own examples — experiment with methods and combine Sets with other data structures for powerful results! 📹 Video reference (MySirG): https://lnkd.in/gfu-c8Tb 💻 Source Code (GitHub): https://lnkd.in/gStvbMtw 🚀 From managing priorities to maintaining uniqueness — every day, one concept stronger! #100DaysLearningChallenge #Day19 #Set #JavaScript #DataStructures #CleanCode #LearningInPublic #DevJourney #AlgoDaily #CodeSmart

Arrays are one of the most powerful data structures in JavaScript — and what makes them even more useful are array methods. These built-in functions allow developers to handle data efficiently without writing complex loops or extra logic. With array methods, you can easily add, remove, search, sort, filter, or transform data in just a single line of code. Functions like map(), filter(), reduce(), push(), and forEach() help simplify everyday coding tasks and make your programs more readable and efficient. They not only save time but also improve code quality — helping you focus on problem-solving instead of repetitive operations. In short, mastering array methods isn’t just about knowing syntax — it’s about writing cleaner, faster, and smarter JavaScript code that performs beautifully in real-world applications. #JavaScript #WebDevelopment #FrontendDevelopment #JavaScriptConcepts #JavaScriptDeveloper #LearnJavaScript #Coding #Programming #FrontendDeveloper

🚀 Day 7 of My 30 Days of JavaScript Challenge 🧩 Problem: Array Reduce Transformation (LeetCode #2626) Given an integer array nums, a reducer function fn, and an initial value init, return the final reduced value. You must solve this without using the built-in Array.reduce() method. 💻 Language: JavaScript 📖 Problem Link: https://lnkd.in/eDiXhyPm 💡 Solution: https://lnkd.in/ezvK8_tY 🧠 Concepts Used Higher-order functions Accumulator pattern Sequential computation Understanding reduce() core logic 📚 Takeaway Rebuilding reduce() helps you understand how JavaScript aggregates data step by step. This concept is foundational for advanced topics like state management, data pipelines, and functional transformations. #Day7 #JavaScript #30DaysOfCode #LeetCode #WebDevelopment #FunctionalProgramming #CodingChallenge #FrontendDevelopment #100DaysOfCode

🚀 Learning Update: Stack Implementation in JavaScript Today I practiced building a Stack data structure from scratch using JavaScript! It follows the LIFO (Last In, First Out) principle — just like a stack of books 📚 The last element added is always the first one removed. Here’s a snippet of my implementation 👇 class Stack {  constructor() {   this.items = [];  }  push(value) {   this.items.push(value);  }  pop() {   if (this.items.length === 0) return undefined;   return this.items.pop();  }  peek() {   return this.items[this.items.length - 1];  } } 🧠 What I learned: How push() and pop() work under the hood Why Stack is useful for undo operations, recursion, and function calls Practiced logical thinking and abstraction Next, I’m going to learn Queue — can’t wait to explore FIFO logic! 💻 #JavaScript #DataStructures #Stack #CodingJourney #WebDevelopment

𝐄𝐯𝐞𝐫 𝐰𝐨𝐧𝐝𝐞𝐫𝐞𝐝 𝐰𝐡𝐞𝐫𝐞 𝐲𝐨𝐮𝐫 𝐉𝐚𝐯𝐚𝐒𝐜𝐫𝐢𝐩𝐭 𝐯𝐚𝐫𝐢𝐚𝐛𝐥𝐞𝐬 𝐚𝐜𝐭𝐮𝐚𝐥𝐥𝐲 𝐥𝐢𝐯𝐞? Let’s make it super simple. Imagine your brain has two spaces — a tiny desk for quick tasks and a big cupboard for storing bulky stuff. That’s exactly how JavaScript manages memory 👇 🧠 𝕊𝕥𝕒𝕔𝕜 𝕄𝕖𝕞𝕠𝕣𝕪 = The Desk This is where small, quick items go — numbers, strings, booleans. It’s fast, neat, and clears up right after you’re done. 𝚕𝚎𝚝 𝚗𝚊𝚖𝚎 = "𝙰𝚗𝚊𝚜"; 𝚕𝚎𝚝 𝚊𝚐𝚎 = 𝟸𝟼; Both variables fit nicely on the stack. 📦 ℍ𝕖𝕒𝕡 𝕄𝕖𝕞𝕠𝕣𝕪 = The Cupboard This is for bigger and more complex things — objects, arrays, functions. It takes more space and time to access. 𝚕𝚎𝚝 𝚞𝚜𝚎𝚛 = { 𝚗𝚊𝚖𝚎: "𝙰𝚗𝚊𝚜", 𝚊𝚐𝚎: 𝟸𝟼 }; The object is stored in the heap, but a reference to it sits in the stack. ⚖️ In short: Stack → fast, organized, for simple data Heap → flexible, powerful, for dynamic data Understanding this helps you write cleaner code, avoid memory leaks, and truly know what happens “under the hood.” #JavaScript #CodingTips #WebDevelopment #LearnInPublic #Frontend #AnasKhan

📅 Day 51 of #100DaysOfWebDevelopment This is part of the 100 Days of Web Development challenge, guided by mentor Muhammad Raheel at ZACoders. 🎯 Mastering Regular Expressions (Regex) in JavaScript 🧠 Today, I explored one of the most powerful tools in JavaScript — Regular Expressions (Regex). Regex allows us to search, match, and manipulate text patterns efficiently, making it an essential skill for form validation, data filtering, and text processing. ✅ What I Practiced Today: 🔹 Created different input fields to test Regex patterns in real time. 🔹 Used expressions to validate email addresses, numbers, letters, and special characters. 🔹 Practiced using RegExp methods like .test(), .match(), and .replace(). 🔹 Learned how to combine character classes, quantifiers, and anchors to form precise patterns. 🔹 Explored how Regex works with flags like g (global), i (case-insensitive), and m (multiline). ✨ Key Takeaways: 💡 Regex helps identify complex text patterns with minimal code. 💡 Validation becomes easier and more efficient using Regex. 💡 Common use cases include form validation, search filters, and input sanitization. 💡 Mastering Regex enhances both frontend and backend development skills. 📂 Please visit my GitHub to check the practice code I worked on today: 👉 GitHub - https://lnkd.in/eME6fwyV #100DaysOfCode #JavaScript #WebDevelopment #FrontendDevelopment #Regex #RegularExpressions #CodingJourney #ZACoders #Day51 #FormValidation