JavaScript Destructuring Essentials: Arrays & Objects

🚀 Day 924 of #1000DaysOfCode ✨ Sorting in JavaScript — Beyond Just `.sort()` Sorting looks simple at first — just call `.sort()` and you’re done, right? Not exactly. In today’s post, I’ve explained sorting in JavaScript in a clear and practical way. From how the default sorting works to how custom compare functions change behavior, everything is broken down so you can confidently sort numbers, strings, and even complex objects. If you’ve ever been surprised by unexpected sorting results, this post will help you understand why that happens. 👇 What’s the most complex data you’ve had to sort in JavaScript? #Day924 #learningoftheday #1000daysofcodingchallenge #FrontendDevelopment #WebDevelopment #JavaScript #React #Next #CodingCommunity

💻 JavaScript Intermediate – Remove Duplicates from an Array Duplicates in arrays can cause bugs or unnecessary processing. Here's a clean way to remove them. 📌 Problem: Get an array containing only unique values. JavaScript code function removeDuplicates(arr) { return [...new Set(arr)]; } console.log(removeDuplicates([1, 2, 2, 3])); 📤 Output: [1, 2, 3] 📖 Explanation: • Set automatically stores unique values only. • Spread operator ... converts it back to an array. 💡 Tip: Use this for data cleaning, API responses, or user inputs. #JavaScript #Coding #WebDevelopment #FrontendDevelopment #LearnToCode #ProgrammingTips

𝗧𝗵𝗶𝘀 𝗜𝘀 𝗔𝗿𝗿𝗮𝘆 𝗗𝗲𝘀𝘁𝗿𝘂𝗰𝘁𝘂𝗿𝗶𝗻𝗴 𝗜𝗻 𝗝𝗮𝘃𝗮𝗦𝗰𝗿𝗶𝗽𝘁 You write JavaScript code and think: "Why so many lines to grab array values?" You start with a simple array: array[0], array[1], array[2]. Then you wonder: Is JavaScript really this repetitive? Good news: you are missing something - it's called Array Destructuring. Array destructuring is an ES6 feature that extracts values from an array and assigns them to variables in one line. It's like unpacking a suitcase: instead of pulling out clothes one by one, you unpack everything at once. Example: const numbers = [10, 20, 30]; const [a, b, c] = numbers; console.log(a, b, c); Output:

🚀 30 Days of JavaScript – Day 16 Starting to build more structured programs using JavaScript. 💡 Today’s Project: Contact Manager This program allows users to: • Add contacts (name & phone) • View stored contacts 🧠 Concepts Used: • functions • arrays of objects • oops • menu-driven logic This helped me understand how to organize code into reusable functions. 🎥 Demo below 👇 Full source code in the First comment. #JavaScript #WebDevelopment #CodingJourney #LearningJavaScript #ProblemSolving

💻 JavaScript Intermediate – Flatten a Nested Array Nested arrays can be tricky, but flattening them makes your data easier to work with. 📌 Problem: Convert a nested array into a single-level array. JavaScript code function flattenArray(arr) { return arr.flat(Infinity); } console.log(flattenArray([1, [2, [3, 4]], 5])); 📤 Output: [1, 2, 3, 4, 5] 📖 Explanation: • flat() method converts nested arrays into a single array. • Using Infinity ensures all levels of nesting are flattened. 💡 Tip: Great for working with complex JSON or API responses. #JavaScript #Coding #WebDevelopment #FrontendDevelopment #LearnToCode #ProgrammingTips

⚠️ The Danger of Splicing Arrays in a Loop "While solving the 'Move Zeroes' challenge today, I encountered a classic JavaScript pitfall: Modifying an array's length while iterating over it. The Mistake: Using .splice() inside a for loop. When you remove an element, the next one shifts left, and your loop index skips it! The Lesson: Always adjust your index or, even better, use the Two-Pointer technique. It's not just safer; it's much more performant for large datasets. Small bugs teach the biggest lessons! 🚀" "Did you know? JavaScript (ES6) allows you to swap array elements in a single line using destructuring : [a, b] = [b, a]. Clean, readable, and efficient!" Feel free to check out my progress and solutions on my LeetCode profile: I've shared my LeetCode profile link in the first comment below! #JavaScript #CodingTips #WebDevelopment #ProblemSolving #LeetCode #AngularDeveloper

🚀 What I Learned Today – JavaScript Arrays Today I explored Arrays in JavaScript and here are the key takeaways 👇 🔹 Arrays are a collection of items 🔹 They are linear (elements stored sequentially) 🔹 Arrays are mutable (can be changed after creation) 📌 Array Indices Positions of elements in an array (starting from 0) 📌 Looping Through Arrays Used to print or access all elements easily 📌 Useful Array Methods ✔️ push() – add element to end ✔️ pop() – remove element from end ✔️ unshift() – add element to start ✔️ shift() – remove element from start ✔️ toString() – convert array to string ✔️ concat() – merge arrays ✔️ slice() – get part of array (no change to original) ✔️ splice() – modify array (add/remove/replace) 💡 Example: slice(start, end) splice(start, deleteCount, newElement) Learning step by step and building strong fundamentals 💪 #JavaScript #WebDevelopment #CodingJourney #FrontendDevelopment #100DaysOfCode)

🚀 Day 933 of #1000DaysOfCode ✨ Sorting Arrays in JavaScript — Different Types Explained Sorting isn’t always just about numbers in ascending order. In today’s post, I’ve covered sorting arrays in JavaScript for different data types — whether it’s numbers, strings, objects, or more complex structures. The goal is to help you understand how sorting behaves internally and how to customize it properly. If you’ve ever faced unexpected results while using `.sort()`, this post will help you gain clarity and control. 👇 What type of array do you find most challenging to sort? #Day933 #learningoftheday #1000daysofcodingchallenge #FrontendDevelopment #WebDevelopment #JavaScript #React #Next #CodingCommunity

🚀 Day 2/30 – Random Color Generator Continuing my 30 Days JavaScript Challenge. Today I built a Random Color Generator using HTML, CSS, and JavaScript. What it does: 🎨 Generates a random HEX color 🖱 Changes background on button click 🔢 Displays the color code dynamically What I learned: ✔ Math.random() logic ✔ DOM manipulation ✔ Updating styles dynamically ✔ Handling events properly Small projects, but strong fundamentals 💪 Live Demo: https://lnkd.in/gTw_h_G3 GitHub Repository: https://lnkd.in/gci2tTXc 28 more projects to go 🚀 #javascript #webdevelopment #codingjourney #30daysofcode #mernstack

🔐 Built a Password Generator using HTML, CSS, and JavaScript. This project was built while learning from Per Borgen. Features: • Custom password length • Option to include uppercase, lowercase, numbers, and symbols • One-click copy to clipboard Live Demo: https://lnkd.in/e8qq5pAH GitHub: https://lnkd.in/e6zgXnX5 Excited to keep learning and building more projects step by step 🚀 #WebDevelopment #JavaScript #LearningJourney