Senior JavaScript Interviews: Understanding this and Arrow Functions

Here’s something commonly asked in JavaScript interviews 👇 Shallow vs Deep Copy Shallow Copy Copies only top-level properties. Nested objects are copied by reference, so changes affect the original. 👉 Ways: Object.assign(), spread (...), Array.from() Deep Copy Creates a fully independent copy, including nested objects. A common approach: JSON.parse(JSON.stringify(obj)) ⚠️ Catch with JSON.stringify() It fails for: • functions (removed) • undefined (removed or become null if arr) • Date (becomes string) • NaN / Infinity (become null) • Map, Set, RegExp (structure lost) • circular references (error) ✅ Better approach const newObj = structuredClone(obj) ✔ Handles most cases (Map, Set, Date, circular refs) ❌ Still can’t clone functions 🔥 Advanced: Custom Deep Clone If you also want to handle functions, you need a custom solution: function deepClone(obj) { if (obj === null || typeof obj !== "object") return obj; if (obj instanceof Date) return new Date(obj); if (obj instanceof RegExp) return new RegExp(obj); if (typeof obj === "function") return obj.bind({}); if (Array.isArray(obj)) { return obj.map(item => deepClone(item)); } const cloned = {}; for (let key in obj) { cloned[key] = deepClone(obj[key]); } return cloned; } ⚠️ Note: • Functions are copied by reference (true cloning isn’t really possible) 💡 Takeaway • Use shallow copy for simple cases • Use structuredClone() for most real scenarios • Use custom clone only when you need full control Don't forget to follow Mohit Sharma 🚀 for more. #JavaScript #Frontend #WebDevelopment #InterviewPrep #ReactJS

In a Javascript L1 & L2 round the following questions can be asked from interviewer. 1. What is the difference between 'Pass by Value' and 'Pass by Reference'? 2. What is the difference between map and filter ? 3. What is the difference between map() and forEach() 4. What is the difference between Pure and Impure functions? 5. What is the difference between for-in and for-of ? 6. What are the differences between call(), apply() and bind() ? 7. List out some key features of ES6 ? 8. What’s the spread operator in javascript ? 9. What is rest operator in javascript ? 10. What are DRY, KISS, YAGNI, SOLID Principles ? 11. What is temporal dead zone ? 12. Different ways to create object in javascript ? 13. Whats the difference between Object.keys,values and entries 14. Whats the difference between Object.freeze() vs Object.seal() 15. What is a polyfill in javascript ? 16. What is generator function in javascript ? 17. What is prototype in javascript ? 18. What is IIFE ? 19. What is CORS ? 20. What are the different datatypes in javascript ? 21. What are the difference between typescript and javascript ? 22. What is authentication vs authorization ? 23. Difference between null and undefined ? 24. What is the output of 3+2+”7” ? 25. Slice vs Splice in javascript ? 26. What is destructuring ? 27. What is setTimeOut in javascript ? 28. What is setInterval in javascript ? 29. What are Promises in javascript ? 30. What is a callstack in javascript ? 31. What is a closure ? 32. What are callbacks in javascript ? 33. What are Higher Order Functions in javascript ? 34. What is the difference between == and === in javascript ? 35. Is javascript a dynamically typed language or a statically typed language 36. What is the difference between Indexeddb and sessionstorage ? 37. What are Interceptors ? 38. What is Hoisting ? 39. What are the differences let, var and const ? 41. Differences between Promise.all, allSettled, any, race ? 42. What are limitations of arrow functions? 43. What is difference between find vs findIndex ? 44. What is tree shaking in javascrip 45. What is the main difference between Local Storage and Session storage 46. What is eval() 47. What is the difference between Shallow copy and deep copy 48. What are the difference between undeclared and undefined variables 49. What is event bubbling 50. What is event capturing 51. What are cookies 52. typeOf operator 53. What is this in javascript and How it behaves in various scenarios 54. How do you optimize the performance of application 55. What is meant by debouncing and throttling 𝐠𝐞𝐭 𝐞𝐛𝐨𝐨𝐤 𝐰𝐢𝐭𝐡 (detailed 232 ques = 90+ frequently asked Javascript interview questions and answers, 90+ Reactjs Frequent Ques & Answers, 50+ Output based ques & ans, 23+ Coding Questions & ans, 2 Machine coding ques & ans) 𝐄𝐛𝐨𝐨𝐤 𝐋𝐢𝐧𝐤: https://lnkd.in/gJMmH-PF Follow on Instagram : https://lnkd.in/gXTrcaKP #javascriptdeveloper #reactjs #reactnative #vuejsdeveloper #angular #angulardeveloper

🚀 JavaScript Interview Questions Every Developer Should Know Here are some useful JS questions with simple answers 👇 🔹 1. What is the output? console.log(typeof null); 👉 Answer: "object" 💡 This is a well-known JavaScript bug. 🔹 2. What is closure? 👉 A closure is a function that remembers variables from its outer scope even after the outer function has finished execution. function outer() { let count = 0; return function inner() { count++; return count; }; } 🔹 3. Difference between == and ===? 👉 == → compares value (loose equality) 👉 === → compares value + type (strict equality) 🔹 4. What is hoisting? 👉 JavaScript moves variable and function declarations to the top of their scope before execution. 🔹 5. What will be the output? let a = 10; (function() { console.log(a); let a = 20; })(); 👉 Answer: ❌ ReferenceError 💡 Due to Temporal Dead Zone (TDZ) 🔹 6. What is event loop? 👉 It handles async operations by managing the call stack and callback queue. 🔹 7. What is this keyword? 👉 Refers to the object that is calling the function (depends on context). 🔹 8. What is a promise? 👉 A promise represents a value that may be available now, later, or never. 🔹 9. What is async/await? 👉 Syntactic sugar over promises to write async code like synchronous code. 🔹 10. What is debounce? 👉 Limits how often a function runs. Useful for search inputs. 🔥 Save this for your next interview 💬 Comment your favorite question 🔁 Share with your developer friends #JavaScript #WebDevelopment #Frontend #InterviewPrep #Coding

JavaScript Hoisting: The Interview Question That Tricks Everyone 🚀 Most developers think they know hoisting. Then the interviewer shows them tricky code. Here's your complete guide to mastering it. --- 🎯 The Definition Hoisting is JavaScript's behavior of moving declarations to the top of their scope during compilation. Key rule: Only declarations are hoisted, NOT initializations. --- 📊 The 3 Types (With Examples) 1. var – Hoisted & Initialized as undefined ```javascript console.log(name); // undefined (not error!) var name = "John"; // JS reads it as: // var name; → console.log(name); → name = "John"; ``` 2. let/const – Hoisted but NOT Initialized (TDZ) ```javascript console.log(age); // ❌ ReferenceError let age = 25; // Temporal Dead Zone – exists but inaccessible ``` 3. Function Declarations – Fully Hoisted ```javascript greet(); // ✅ "Hello" – works! function greet() { console.log("Hello"); } // Function expressions? NOT hoisted! ``` --- 🌍 Real-World Example The Bug That Wastes Hours: ```javascript function processOrders(orders) { for (var i = 0; i < orders.length; i++) { setTimeout(() => { console.log(orders[i]); // undefined × 3 }, 1000); } } // Why? var is function-scoped, hoisted to top. // Fix: Use let (block-scoped) or closure ``` The Solution: ```javascript function processOrders(orders) { for (let i = 0; i < orders.length; i++) { setTimeout(() => { console.log(orders[i]); // ✅ Works! }, 1000); } } ``` --- 💡 Senior-Level Insight "Hoisting explains why: · var causes unexpected bugs (always use let/const) · TDZ prevents accessing variables before declaration · Function hoisting enables clean code organization Modern JS best practice: Declare variables at the top. Use const by default, let when reassignment needed." --- 🎤 Interview Answer Structure Q: "Explain hoisting." "Hoisting is JavaScript's compilation-phase behavior where declarations are moved to the top. Function declarations are fully hoisted, var variables hoisted as undefined, while let/const are hoisted but stay in Temporal Dead Zone until execution. This is why we get undefined with var but ReferenceError with let when accessed early." --- 📝 Quick Cheat Sheet Type Hoisted Initial Value Access Before Declaration var ✅ undefined Returns undefined let ✅ Uninitialized ❌ ReferenceError (TDZ) const ✅ Uninitialized ❌ ReferenceError (TDZ) Function Dec ✅ Function itself ✅ Works fine --- 🚨 Common Interview Twist: ```javascript var a = 1; function test() { console.log(a); // undefined (not 1!) var a = 2; } test(); // Why? Inner var a is hoisted to top of function scope ``` --- Master hoisting = Master JavaScript execution. Found this helpful? ♻️ Share with your network. Follow me for more interview prep content! #JavaScript #CodingInterview #WebDevelopment #TechInterview #JSHoisting

#js #19 **Optional Chaining in Javascript** Optional Chaining (?.) in JavaScript is used to safely access nested properties without causing errors if something is null or undefined. 🔹 Why We Need It Without optional chaining: const user = null; console.log(user.name); // ❌ Error: Cannot read property 'name' 👉 This crashes your code. ✅ With Optional Chaining const user = null; console.log(user?.name); // undefined ✅ (no error) 👉 If user is null or undefined, it stops and returns undefined 🔹 Syntax obj?.propertyobj?.[key]obj?.method() ✅ Examples 📌 1. Nested Objects const user = { profile: { name: "Navnath" }}; console.log(user?.profile?.name); // Navnath console.log(user?.address?.city); // undefined 📌 2. Function Calls const user = { greet() { return "Hello"; }}; console.log(user.greet?.()); // Hello console.log(user.sayHi?.()); // undefined (no error) 📌 3. Arrays const arr = [1, 2, 3]; console.log(arr?.[0]); // 1 console.log(arr?.[5]); // undefined 🔥 Real Use Case (Very Common) const response = { data: { user: { name: "Navnath" } }}; const name = response?.data?.user?.name; 👉 Avoids writing multiple checks like: if (response && response.data && response.data.user) ... ⚠️ Important Points ❌ Doesn’t Work on Undeclared Variables console.log(user?.name); // ❌ if user is not defined at all ⚠️ Stops Only on null / undefined const obj = { value: 0 }; console.log(obj?.value); // 0 ✅ (not skipped) 🔥 Combine with Nullish Coalescing (??) const user = {}; const name = user?.name ?? "Guest"; console.log(name); // Guest 🧠 Easy Memory Trick ?. → "If exists, then access" Otherwise → return undefined, don’t crash #Javascript #ObjectOrientedProgramming #SoftwareDevelopment

Top React & JavaScript Interview Questions to Master in 2026 ☑️JavaScript & React-Based: 1. Implement Promise.all polyfill 2. Implement Promise.any polyfill 3. Implement Array.prototype.reduce polyfill 4. Implement Lodash’s flatten method 5. Implement auto-retry for promises 6. Throttle promises by batching 7. Debouncing implementation 8. Throttling implementation 9. Execute N callback-based async tasks in series 10. Output prediction for tricky 10-15 JavaScript snippets 11. Object vs Map differences in JavaScript 12. Difference between PATCH and PUT 13. What is the difference between debounce and throttle? 14. How does the JavaScript Engine work? 15. What is the Event Loop and how does the Microtask Queue work? 16. Explain Virtual DOM and its comparison mechanism 17. Why do keys matter in React and how do they improve performance? 18. Explain how useState works internally 19. Implement a basic version of useState 20. What are React Portals? How are modals mounted using them? 21. What are Error Boundaries in React? 22. How does memoization work in React? 23. SSR vs CSR with examples and use-cases 24. What is Module Federation? 25. What is Micro-Frontend Architecture? 26. Server-Side Rendering techniques to improve SEO 27. How to control tab order in DOM (explain tabIndex) 28. What is Event Capturing and Bubbling 29. How to override toString on String.prototype 30. What are memory leaks in React and how to detect them? 31. How to measure performance in a React application? 32. What is OAuth and how does it work? 33. How does SSO work? 34. What are REST API methods and their differences? 35. Principles of Functional Programming 36. What are microservices? 37. How would you build a tool like Create React App? 38. How do you structure reusable UI components in React? Follow Alpna P. for more related content! 🤔 Having Doubts in technical journey? 🚀 Book 1:1 session with me : https://lnkd.in/gQfXYuQm 🚀 Subscribe and stay up to date: https://lnkd.in/dGE5gxTy 🚀 Get Complete React JS Interview Q&A Here: https://lnkd.in/d5Y2ku23 🚀 Get Complete JavaScript Interview Q&A Here: https://lnkd.in/d8umA-53 #ReactJS #JavaScript #FrontendDevelopment #WebDevelopment #ReactDeveloper #JavaScriptInterview #TechInterviews #Hiring2026 #SoftwareEngineering #React19 #ServerComponents #FrontendEngineer #CodingInterviews #LinkedInTech #WebDevCommunity

Recently in an interview, I was asked about the JavaScript Event Loop… I thought I knew it — but explaining it clearly was harder than expected. So I created this diagram to understand it properly 👇 • Understanding JavaScript Event Loop (Simple Explanation) ° JavaScript Engine JavaScript runs on a single thread. It uses: • Memory Heap → to store data • Call Stack → to execute code 📞 Call Stack All synchronous code runs here. Functions are pushed and popped one by one. 🌐 Web APIs (Browser / Node.js) Async operations are handled outside the JS engine: • setTimeout / setInterval • fetch API • DOM events These APIs run in the background. 📥 Queues Once async work is done, callbacks go into queues: 👉 Microtask Queue (High Priority) • Promise.then() • async/await 👉 Task Queue (Low Priority) • setTimeout • setInterval • DOM events 🔁 Event Loop (Most Important Part) The event loop keeps checking: Is Call Stack empty? Execute ALL Microtasks Then execute ONE Task from Task Queue That’s why Promises run before setTimeout! One Line Summary: JavaScript uses Call Stack + Web APIs + Queues + Event Loop to handle async code without blocking execution. This is one of the most common interview questions — but also one of the most misunderstood. If you can explain this clearly, you’re already ahead of many developers. #JavaScript #EventLoop #AsyncJavaScript #WebDevelopment #NodeJS #Frontend #Programming #Interview

I have seen candidates 𝗚𝗲𝘁 𝗛𝗶𝗿𝗲𝗱 not because they solved every problem perfectly. But because they showed a deep understanding of JavaScript fundamentals. Your React knowledge is solid. Your CSS skills are on point. But the interview is not going well. Then they ask you to solve a problem in vanilla JavaScript. This is your moment. Here is how JavaScript basics can turn your interview around: 𝟭. 𝗪𝗵𝗲𝗻 𝘁𝗵𝗲𝘆 𝗮𝘀𝗸 "𝗥𝗲𝗺𝗼𝘃𝗲 𝗱𝘂𝗽𝗹𝗶𝗰𝗮𝘁𝗲𝘀 𝗳𝗿𝗼𝗺 𝗮𝗻 𝗮𝗿𝗿𝗮𝘆 - While others struggle with complex solutions, you mention Set and spread operators. - Simple. Clean. Shows you understand ES6. 𝟮. 𝗪𝗵𝗲𝗻 𝘁𝗵𝗲𝘆 𝗮𝘀𝗸 "𝗙𝗶𝗻𝗱 𝘁𝗵𝗲 𝗺𝗼𝘀𝘁 𝗳𝗿𝗲𝗾𝘂𝗲𝗻𝘁 𝗲𝗹𝗲𝗺𝗲𝗻𝘁 - You confidently talk about using the reduce method while others are thinking about nested loops. - Interviewers love developers who know array methods well. 𝟯. 𝗪𝗵𝗲𝗻 𝘁𝗵𝗲𝘆 𝗮𝘀𝗸 𝗜𝗺𝗽𝗹𝗲𝗺𝗲𝗻𝘁 𝗱𝗲𝗯𝗼𝘂𝗻𝗰𝗶𝗻𝗴 - This one separates junior from senior developers. - If you can explain closures and setTimeout together, you stand out immediately. 𝟰. 𝗪𝗵𝗲𝗻 𝘁𝗵𝗲𝘆 𝗮𝘀𝗸 𝗖𝗵𝗲𝗰𝗸 𝗶𝗳 𝘀𝘁𝗿𝗶𝗻𝗴 𝗶𝘀 𝗽𝗮𝗹𝗶𝗻𝗱𝗿𝗼𝗺𝗲 Everyone thinks of long solutions. You mention splitting, reversing, and joining. Shows you think in JavaScript, not just translate from other languages. 𝗧𝗵𝗲 𝗿𝗲𝗮𝗹 𝗴𝗮𝗺𝗲 𝗰𝗵𝗮𝗻𝗴𝗲𝗿 𝗺𝗼𝗺𝗲𝗻𝘁𝘀: - When you explain why you chose map over forEach. - When you mention performance differences between different approaches. - When you talk about async/await and proper error handling. 𝗕𝘂𝘁 𝗵𝗲𝗿𝗲 𝗶𝘀 𝘄𝗵𝗮𝘁 𝗿𝗲𝗮𝗹𝗹𝘆 𝗶𝗺𝗽𝗿𝗲𝘀𝘀𝗲𝘀 𝗶𝗻𝘁𝗲𝗿𝘃𝗶𝗲𝘄𝗲𝗿𝘀: Not just describing working solutions. But explaining WHY your approach works. Talking about browser compatibility. Mentioning edge cases. Discussing time complexity. 𝗠𝘆 𝗯𝗶𝗴𝗴𝗲𝘀𝘁 𝗶𝗻𝘁𝗲𝗿𝘃𝗶𝗲𝘄 𝘄𝗶𝗻𝘀 𝗰𝗮𝗺𝗲 𝗳𝗿𝗼𝗺: - Explaining the event loop when discussing async code - Showing knowledge of proper error handling in promises - Discussing different ways to solve same problem - Knowing when to use which array method The trick is not memorizing solutions. It is understanding JavaScript deeply enough that you can think through problems step by step. Strong JavaScript skills show you can adapt to any frontend framework. Because at the end of the day, React, Vue, Angular - they are all just JavaScript. 𝗜 𝗵𝗮𝘃𝗲 𝗽𝗿𝗲𝗽𝗮𝗿𝗲𝗱 𝗜𝗻𝘁𝗲𝗿𝘃𝗶𝗲𝘄 𝗣𝗿𝗲𝗽𝗮𝗿𝗮𝘁𝗶𝗼𝗻 𝗚𝘂𝗶𝗱𝗲 𝗳𝗼𝗿 𝗙𝗿𝗼𝗻𝘁𝗲𝗻𝗱 𝗘𝗻𝗴𝗶𝗻𝗻𝗲𝗿𝘀. covering JavaScript, React, Next.js, System Design, and more. 𝗚𝗲𝘁 𝘁𝗵𝗲 𝗚𝘂𝗶𝗱𝗲 𝗵𝗲𝗿𝗲 - https://lnkd.in/d2w4VmVT 💙- If you've read so far, do LIKE and RESHARE the post

🚀 Understanding JSX in React — Syntax & Rules Simplified! If you're working with React, JSX is everywhere. But JSX is not HTML—it’s JavaScript with a syntax extension. 💡 What is JSX? JSX (JavaScript XML) lets you write UI like this: const element = <h1>Hello, World!</h1>; 👉 Behind the scenes, React converts this into: React.createElement("h1", null, "Hello, World!"); ⚙️ How JSX works 👉 JSX is compiled into JavaScript 👉 It describes what the UI should look like 👉 React uses it to create Virtual DOM 🧠 Key Rules of JSX (Very Important!) 🔹 1. Return a single parent element // ❌ Wrong return ( <h1>Hello</h1> <p>World</p> ); // ✅ Correct return ( <> <h1>Hello</h1> <p>World</p> </> ); 🔹 2. Use className instead of class <div className="container"></div> 🔹 3. JavaScript inside {} const name = "React"; <h1>Hello {name}</h1> 🔹 4. Self-closing tags <img src="image.png" /> 🔹 5. Inline styles as objects <div style={{ color: "red" }}></div> 🧩 Real-world use cases ✔ Building UI components ✔ Rendering dynamic data ✔ Conditional UI rendering ✔ Mapping lists 🔥 Best Practices (Most developers miss this!) ✅ Keep JSX clean and readable ✅ Extract complex logic outside JSX ✅ Use fragments instead of unnecessary divs ❌ Avoid writing heavy logic inside JSX ⚠️ Common Mistake // ❌ Too much logic inside JSX return <h1>{user.isLoggedIn ? "Welcome" : "Login"}</h1>; 👉 Fine for small cases, but extract logic for complex UI 💬 Pro Insight JSX is not about writing HTML in JS— 👉 It’s about describing UI in a declarative way 📌 Save this post & follow for more deep frontend insights! 📅 Day 6/100 #ReactJS #FrontendDevelopment #JavaScript #JSX #WebDevelopment #SoftwareEngineering #100DaysOfCode 🚀