JavaScript/TypeScript Pagination with Slice and Map

Day9:3-04-2026 Here is the simple and main point explanation (no code): 1. confirm() It is a popup dialog box in JavaScript. It shows a message with OK and Cancel buttons. It is used to get confirmation from the user. If the user clicks OK → returns true. If the user clicks Cancel → returns false. Commonly used for: Delete confirmation Form submission confirmation Exit warning 2. eval() It is used to evaluate or execute a string as JavaScript code. It converts a string expression into actual code. Mostly used for: Calculating mathematical expressions written as strings. It is not recommended for regular use because: It is a security risk It slows down performance It can execute harmful code 3. Number Convert to String There are ways to convert a number into a string. Why we convert? To display numbers as text. To combine numbers with text. For formatting purposes. Main Points: A number can be converted into a string type. After conversion, it behaves like text. You cannot perform arithmetic operations directly on it unless converted back to number. The data type changes from number → string. If you want, I can also explain: String to number conversion Difference between parseInt() and Number()

Day 3 of My JavaScript Journey Today, I learned about JavaScript data types and how to define variables. JavaScript has two main types of data: Primitive data types: These include 7 types such as number, string, boolean, null, undefined, symbol, and bigint. Object: used to store more complex data. I also learned three ways to declare variables in JavaScript: • let • const • var One key thing I understood: "const" should be used by default, "let" when the value needs to change, and "var" is mostly outdated. Example: const name = "John"; let age = 20; Key takeaway: Understanding data types and variable declarations is fundamental to writing clean and predictable JavaScript code. #JavaScript #WebDevelopment #LearningInPublic #100DaysOfCode

🔁 Closures in JavaScript — Not Just Theory, Real Power 🔥 A closure is NOT just a definition It’s how JavaScript enables data privacy & smart functions 👇 🔹 Definition A function that remembers its lexical scope even after execution 🔹 Example function counter() { let count = 0; return function () { count++; return count; }; } const c = counter(); console.log(c()); // 1 console.log(c()); // 2 🔹 What’s happening? 🤔 count is preserved in memory Inner function “closes over” outer scope 🔹 Real Use Cases 💡 Data hiding (private variables) React hooks internally Event handlers 🔹 Common Interview Trap 🚨 Closures inside loops: for (var i = 0; i < 3; i++) { setTimeout(() => console.log(i), 1000); } 👉 Output: 3 3 3 Fix using let ✅ 🔹 Interview Insight 🎯 Say: 👉 “Closures allow function to retain access to variables after execution” ⚠️ Pro Tip: Closures can cause memory leaks if misused Closures = Hidden superpower of JS 💡 #JavaScript #Closures #Frontend #CodingInterview

Day 8/100 of JavaScript 🚀 Today’s Topic: Objects and their manipulation Objects in JavaScript store data in key-value pairs Example: const user = { name: "Apsar", age: 24 }; 🔹Accessing values user.name user["age"] 🔹Adding / updating user.city = "Chennai"; user.age = 25; 🔹Deleting delete user.city; 🔹Iteration for (let key in user) { console.log(key, user[key]); } 🔹Useful methods Object.keys(user); Object.values(user); Object.entries(user); 🔹Copy (shallow) const newUser = { ...user }; 🔹Object.freeze() Object.freeze(user); user.age = 30; // ❌ no change Prevents adding, deleting, or updating properties 🔹Object.seal() Object.seal(user); user.age = 30; // ✅ allowed user.city = "Chennai"; // ❌ not allowed Allows update, but prevents add/delete 🔹Object.assign() const obj = Object.assign({}, user); Used to copy or merge objects Objects are reference types. Methods like "freeze" and "seal" help control how data can be modified #Day8 #JavaScript #100DaysOfCode

Three dots that changed JavaScript: ... The spread operator in action: Arrays: // Copy const copy = [...original] // Merge const all = [...arr1, ...arr2] // Add items const updated = [...items, newItem] Objects: // Copy const clone = { ...user } // Merge const combined = { ...defaults, ...config } // Update const modified = { ...user, age: 30 } Function calls: Math.max(...numbers) fetch(url, { ...defaultOptions, ...customOptions }) Before spread operator: const copy = original.slice() const merged = Object.assign({}, obj1, obj2) fn.apply(null, args) After spread operator: const copy = [...original] const merged = { ...obj1, ...obj2 } fn(...args) The magic: → No mutation (safer code) → Cleaner syntax → Works with any iterable → Essential for React state → Makes immutability easy Three dots. Infinite possibilities.

💡Don't Use Array Spread Operator In Every Case💡 Yes, you heard that right. If you have a very large data set, then using array spread operator to create a new array will slow down your application and you might receive, "Maximum call stack size exceeded" error. So instead of using array spread operator, use array concat method. const largeArray = [/* your large array */]; const newArray = [/* additional items */]; // Using spread operator (slow for large arrays) const combinedArray1 = [...largeArray, ...newArray]; // Using concat method (more efficient for large arrays) const combinedArray2 = largeArray.concat(newArray); So If you have a very large array, then avoid using spread operator, instead use array concat method. This is because spread operator creates a new array which means each spread operator like …arr1, …arr2 will create a new array and then iterates and then returns a new array. For example, with const result = […arr1, …arr2], javascript will create three arrays one for the result and one for each spread operator (and then iterates it) If we use the same for concat method then there would be one array creation which is result meaning the concat method directly iterates the array. 𝗙𝗼𝗿 𝗺𝗼𝗿𝗲 𝘀𝘂𝗰𝗵 𝘂𝘀𝗲𝗳𝘂𝗹 𝗰𝗼𝗻𝘁𝗲𝗻𝘁, 𝗱𝗼𝗻'𝘁 𝗳𝗼𝗿𝗴𝗲𝘁 𝘁𝗼 𝗳𝗼𝗹𝗹𝗼𝘄 𝗺𝗲. #javascript #reactjs #typescript #webdevelopment

🚀 Understanding Recursion + Finding Maximum in Nested Arrays (JavaScript) Today I practiced a powerful concept in JavaScript — recursion with nested arrays — and used it to solve a real problem: 👉 Find the maximum number from a deeply nested array 💡 Example: [1, 0, 7, [2, 5, [10], 4]] 🔍 Approach I followed: ✅ Step 1: Used recursion to flatten the nested array If the element is a number → push into result If it’s an array → call the same function again ✅ Step 2: After flattening, used a loop to find the maximum value 🧠 Key Learnings: • Each recursive call creates its own memory (execution context) • Data is temporarily stored in the call stack • The return keyword helps pass results back step by step • Without capturing the returned value, recursion results can be lost • Breaking problems into smaller parts makes complex logic easier ⚡ Final Output: 👉 Maximum number: 10 💬 This exercise really helped me understand: How recursion works internally How data flows through function calls Difference between primitive and reference types #JavaScript #Recursion #ProblemSolving #WebDevelopment #CodingJourney

🧠 Day 28 — WeakMap & WeakSet in JavaScript (Simplified) You’ve seen Map & Set — now let’s look at their smarter versions 👀 --- 🔍 What makes them “Weak”? 👉 They hold weak references to objects 👉 If the object is removed, it can be garbage collected automatically --- ⚡ 1. WeakMap 👉 Key-value pairs (like Map) 👉 Keys must be objects only let obj = { name: "John" }; const weakMap = new WeakMap(); weakMap.set(obj, "data"); console.log(weakMap.get(obj)); // data --- ⚠️ Important ❌ Keys must be objects ❌ Not iterable (no loop) ❌ No size property --- ⚡ 2. WeakSet 👉 Collection of unique objects let obj1 = { id: 1 }; const weakSet = new WeakSet(); weakSet.add(obj1); console.log(weakSet.has(obj1)); // true --- 🧠 Why use them? 👉 Helps with memory management 👉 Avoids memory leaks 👉 Used internally in frameworks --- 🚀 Real-world use ✔ Caching objects temporarily ✔ Tracking object references ✔ Managing private data --- 💡 One-line takeaway: 👉 “WeakMap & WeakSet allow objects to be garbage collected automatically.” --- If you want to go deeper into JavaScript internals, this is a great concept. #JavaScript #WeakMap #WeakSet #WebDevelopment #Frontend #100DaysOfCode 🚀

🔑 JavaScript Set Methods – Quick Guide 1. Creation const letters = new Set(["a","b","c"]); // from array const letters = new Set(); // empty letters.add("a"); // add values 2. Core Methods MethodPurposeExampleReturns add(value)Add unique valueletters.add("d")Updated Set delete(value)Remove valueletters.delete("a")Boolean clear()Remove all valuesletters.clear()Empty Set has(value)Check existenceletters.has("b")true/false sizeCount elementsletters.sizeNumber 3. Iteration Methods MethodPurposeExample forEach(callback)Run function for each valueletters.forEach(v => console.log(v)) values()Iterator of valuesfor (const v of letters.values()) {} keys()Same as values() (compatibility with Maps)letters.keys() entries()Iterator of [value, value] pairsletters.entries() 4. Key Notes Unique values only → duplicates ignored. Insertion order preserved. typeof set → "object". set instanceof Set → true. 📝 Exercise Answer Which method checks if a Set contains a specified value? 👉 Correct answer: has() 🎯 Memory Hooks Set = Unique Collection Think: “No duplicates, only distinct members.” add to insert, has to check, delete to remove, clear to reset.

𝗧𝗵𝗲 𝗨𝗹𝗧𝗶𝗺𝗮𝗧𝗲 𝗚𝗨𝗶𝗱𝗲 𝗧𝗼 𝗔𝗿𝗿𝗮𝗬 𝗙𝗟𝗔𝗧𝗧𝗘𝗡𝗜𝗡𝗚 You work with arrays in JavaScript, but they can get nested and hard to use. That's where array flattening comes in. A nested array is an array inside another array. For example: - `[3, 4]` is a nested array - `[5, [6, 7]]` is a deeply nested array Flattening converts a nested array into a single-level array. You can use array flattening in: - API responses with nested data - Data processing and transformation - Simplifying loops and operations - Preparing data for UI rendering There are different ways to flatten arrays: - Using `flat()` - the easiest way in modern JavaScript - Using recursion - important for interviews - Using a stack - an iterative approach When solving flatten problems, think: - Is recursion needed? - Can I reduce complexity? - What is the depth? - Should I preserve order? Array flattening is a must-know concept in JavaScript. It strengthens recursion skills, improves problem-solving ability, and appears frequently in interviews. Source: https://lnkd.in/grRq_v3K