1. How does JavaScript handle concurrency if it’s single-threaded?

JS is single-threaded, but the browser/Node provides a task queue + event loop.
Long operations run via Web APIs or C++ bindings (in Node) and their callbacks are queued.
This is how JS looks concurrent without true multithreading.

2. Explain V8 Hidden Classes and Inline Caching.

Hidden Classes → V8 creates “shapes” for objects internally to optimize property access. Changing object structure often can hurt performance.
Inline Caching → V8 remembers the type of object property accessed to speed up repeated lookups.

That’s why it’s better to use consistent object structures in performance-critical code.

3. What are Zones in JavaScript? (used in Angular)

Zones are a way to intercept and track async operations (timers, promises, events).

Angular uses it to detect when async tasks complete, so it knows when to run change detection.

4. How does JavaScript’s Just-In-Time (JIT) Compilation work?

JS engines like V8 don’t interpret line by line only.
They parse code → generate bytecode → hot code paths are optimized into machine code by JIT compiler.
If assumptions fail, code is de-optimized.

5. Explain the difference between Monomorphic, Polymorphic, and Megamorphic function calls.

Monomorphic → function always called with same type of arguments → fast.
Polymorphic → called with few different types → still optimized.
Megamorphic → too many types → engine gives up optimization → slower.

6. What is Tail Call Optimization (TCO) in JavaScript?

In strict mode ES6, recursive calls in tail position (last statement) don’t grow the call stack.

This prevents stack overflow in deep recursion.

"use strict";
function factorial(n, acc = 1) {
  if (n === 0) return acc;
  return factorial(n - 1, n * acc); // Tail call
}

7. How does JavaScript handle BigInt differently from Number?

Number is IEEE-754 double precision (max ~2^53).
BigInt can store arbitrarily large integers but is slower and not mixable with Numbers directly.

8. What are Realms in JavaScript?

A Realm is like a separate JS environment with its own global objects (Array, Object, etc.).

Example: iframe in browser has its own Realm.
Objects from different realms aren’t equal (iframe.Array !== window.Array).

9. What are WeakRefs and Finalizers used for?

WeakRef → reference to object without preventing GC.
FinalizationRegistry → lets you run cleanup code after object is garbage collected.

Should be used very carefully (advanced memory management).

10. How does JavaScript handle async iteration (`for await...of`)?

Normal for...of → works with iterables.
for await...of → works with async iterables (streams, paginated APIs).

It pulls data as Promises, one by one.

11. Explain SharedArrayBuffer and Atomics in JS.

Normally JS is single-threaded.
With Web Workers + SharedArrayBuffer, multiple threads can access the same memory.
Atomics methods provide safe operations (like locks) to avoid race conditions.

12. What is the difference between Microtasks, Macrotasks, and Render Tasks?

Microtasks → Promises, MutationObserver (executed before repaint).
Macrotasks → setTimeout, setInterval, I/O callbacks.
Render tasks → browser’s repaint/reflow cycle.

Understanding this helps in performance tuning (avoid layout thrashing).

13. How does JavaScript handle module resolution in ES Modules vs CommonJS?

CommonJS (Node) → synchronous require(), executes immediately.
ESM → static import/export, async loading, supports tree-shaking.
Node uses dual package support ("type": "module" in package.json).

14. What are JavaScript WeakMaps really used for?

Used for private data inside objects because keys are not enumerable and garbage-collected safely.
Example: storing metadata about DOM nodes without memory leaks.

15. What are Generators + Async Generators really useful for?

Generators (function*) → pause/resume execution, useful for iterators.
Async Generators (async function*) → consume data streams piece by piece (like async pagination).

16. What are Decorators in JavaScript (Stage 3 Proposal)?

Decorators are special functions for meta-programming — adding behavior to classes/methods at definition time.

Used heavily in frameworks like Angular.

function readonly(target, key, desc) {
  desc.writable = false;
  return desc;
}

class Example {
  @readonly
  method() {}
}

17. How does JavaScript handle memory leaks?

Memory leaks often happen due to:

Global variables not cleared.
Detached DOM nodes still referenced.
Closures keeping large data alive.

Tools: Chrome DevTools → Memory tab to debug leaks.

18. Explain the difference between an Interpreter, JIT, and AOT in JS engines.

Interpreter → executes line by line (slow).
JIT (Just-In-Time) → compiles hot code into machine code at runtime (fast).
AOT (Ahead-of-Time) → not common in JS, but frameworks like Angular use it for templates.

19. How does JavaScript optimize `try...catch` blocks?

Engines usually de-optimize functions containing try...catch, so avoid wrapping large logic inside them.

Better: keep try...catch small and focused.

20. How does requestAnimationFrame differ from setTimeout?

setTimeout → runs after delay, not in sync with browser painting.
requestAnimationFrame → runs just before next repaint, optimized for smooth 60fps animations.

21. How do modern JS engines handle OS-level threads?

JS itself is single-threaded.
But browsers use multi-threading internally:
- One thread for JS execution.
- One for rendering (compositor).
- One for networking.
- Workers for parallel execution.

22. What are generator coroutines used for in deep async flows?

Before async/await, libraries like co used generators as coroutines for async flow control.
Now async/await replaced them, but still useful in lazy async streams.

23. What is a “Hidden Class Transition” in V8?

When you create an object with properties in different orders, V8 creates new hidden classes.
Best practice: initialize all properties in the same order to avoid extra transitions.

let a = {x: 1, y: 2}; // hidden class A
let b = {y: 2, x: 1}; // hidden class B (different order → slower)