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.
  Copy

  "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)