T

TechIdea

Ecosystem

JavaScript Interview Questions

Master core JavaScript concepts, closures, async/await, and the event loop with real-world scenarios.

Editorial note

Written by TechIdea Editorial Team

T

TechIdea Editorial Team

Our technical reviewers ensure all interview questions are accurate, up-to-date, and aligned with industry standards.

This guide is created to help beginners understand SEO, blogging, AI tools, and online growth in simple English. We focus on practical steps, original examples, and safe website growth methods.

Last updated: 2026-06-14

Intermediate

How does the JavaScript Event Loop work?

The Event Loop is how JavaScript handles multiple tasks (like fetching data or timers) without freezing the browser, even though it only has one single thread. It pushes quick tasks to the Call Stack, and sends slow tasks to Web APIs. When slow tasks finish, they wait in a Queue until the Call Stack is empty, and then the Event Loop moves them back to be executed.

Deep Dive

In a real interview, you should explain it in three parts: The Call Stack, Web APIs, and the Callback Queue (Task Queue). 1. **Call Stack:** Where your code is executed line by line. If a function is called, it goes on the stack. When it finishes, it pops off. 2. **Web APIs:** When JS hits an asynchronous task like `setTimeout` or a `fetch` request, it hands it off to the browser's Web APIs so the Call Stack can keep running other code. 3. **Callback/Microtask Queue:** Once the Web API finishes the task, it sends the callback function to the Queue. 4. **The Event Loop:** This is a constant monitoring process. It checks: 'Is the Call Stack empty?' If yes, it takes the first task from the Queue and pushes it to the Call Stack to be executed.

Real World Example: Imagine a fast-food restaurant with one cashier (Call Stack). You order a burger. If the cashier went to the kitchen to cook it, the line would stop (blocking). Instead, they send the order to the kitchen (Web APIs) and take the next customer's order. When your burger is ready, it's placed on the pickup counter (Queue). When the cashier finishes with their current customer (Call Stack is empty), they hand you your burger (Event Loop).
💡 Interview Tip:Don't just recite definitions. Mention the difference between the **Microtask Queue** (used for Promises) and the **Macrotask Queue** (used for setTimeout). Interviewers love asking which one has higher priority (Answer: Microtasks are processed before Macrotasks).
Common Mistakes:

Thinking JavaScript is multi-threaded. It is single-threaded. Asynchrony is provided by the browser environment, not the JavaScript engine itself.

BeginnerScenario Based

A React page is fetching data twice on load. How do you debug it?

In React 18, Strict Mode causes components to mount, unmount, and remount in development mode. This makes `useEffect` run twice to help you catch bugs. It will only run once in production.

Deep Dive

When debugging a double-fetch, the first thing I check is if the app is wrapped in `<React.StrictMode>` inside `index.js` or `main.jsx`. In React 18, Strict Mode intentionally double-invokes `useEffect` in development to simulate how components behave when they are hidden and restored (like navigating tabs). If it's not Strict Mode, I check the dependency array of the `useEffect`. If a state variable or an object/function reference is in the dependency array and it changes immediately after the fetch, it will trigger an infinite loop or a double fetch.

Real World Example: You have a dashboard that loads a list of users. You notice the network tab shows two API calls to `/api/users`. Before wasting hours trying to rewrite the fetch logic, build the app for production (`npm run build` and `npm start`). If the double call disappears, it was just Strict Mode.
💡 Interview Tip:Interviewers ask this to see if you have hands-on experience with React 18. Mentioning Strict Mode immediately shows you've encountered this real-world frustration.
Common Mistakes:

Removing `<React.StrictMode>` just to stop the double logs. It's better to leave it and use a cleanup function inside `useEffect` (like an AbortController for fetch requests) to cancel the first request.

Growth Newsletter

Get practical AI tools, SEO tips, and growth guides weekly.

Join creators, students, and businesses scaling with TechIdea.