𝗔𝘀𝘆𝗻𝗰𝗵𝗿𝗼𝗻𝗼𝘂𝘀 𝗝𝗮𝘃𝗮𝗦𝗰𝗿𝗶𝗽𝘁:

Question 2

What are Web Workers, and when should you use them?

Answer 2

“Web Workers are JavaScript scripts that run in background threads, separate from the main thread, enabling parallel execution without blocking the UI. They’re ideal for CPU-intensive tasks like data processing or complex calculations.

For example:

// main.js
const worker = new Worker('worker.js');
worker.postMessage([1, 2, 3]);
worker.onmessage = (e) => console.log(e.data); // Outputs processed data

// worker.js
self.onmessage = (e) => {
  const result = e.data.map(x => x * 2);
  self.postMessage(result);
};

Use Web Workers for tasks like image processing or large dataset computations, but not for DOM manipulation, as they lack DOM access. As an SDET, I’d test Web Workers to ensure data is correctly passed, processed, and returned without impacting UI performance.”

Question 3

How does setTimeout and setInterval work under the hood?

Answer 3

“setTimeout schedules a function to run after a specified delay, while setInterval runs a function repeatedly at a fixed interval. Both use the browser’s or Node.js’s timer APIs, managed by the event loop. The callback is placed in the task queue after the delay, but it only executes when the call stack is empty.

For example:

setTimeout(() => console.log('Delayed'), 1000); // Runs after ~1s
setInterval(() => console.log('Every second'), 1000); // Runs every ~1s

Delays aren’t guaranteed if the main thread is busy. As an SDET, I’d test setTimeout for correct timing under load and setInterval for consistent intervals, ensuring no callback pileup.”

Question 4

Explain Microtasks and Macrotasks in JavaScript.

Answer 4

“JavaScript’s event loop processes tasks in two queues: Macrotasks and Microtasks. Macrotasks include events like setTimeout, setInterval, and I/O operations, processed one per loop iteration. Microtasks, like Promise callbacks and queueMicrotask, are higher-priority and execute immediately after the current macrotask, before the next macrotask.

For example:

console.log('Start');
setTimeout(() => console.log('Timeout'), 0); // Macrotask
Promise.resolve().then(() => console.log('Promise')); // Microtask
console.log('End');
// Outputs: Start, End, Promise, Timeout

Microtasks take precedence, which can delay macrotasks. As an SDET, I’d test task ordering to ensure async code executes in the expected sequence and avoid starvation of macrotasks.”

Question 5

What is Promise.all(), and how does it differ from Promise.race()?

Answer 5

Response:

“Promise.all() takes an array of promises and returns a new promise that resolves with an array of all resolved values when all input promises resolve, or rejects with the first rejection. Promise.race() resolves or rejects as soon as any one of the input promises settles.

For example:

const p1 = Promise.resolve('One');
const p2 = new Promise(resolve => setTimeout(() => resolve('Two'), 1000));

// Promise.all
Promise.all([p1, p2]).then(values => console.log(values)); // ['One', 'Two'] after 1s

// Promise.race
Promise.race([p1, p2]).then(value => console.log(value)); // 'One' immediately

As an SDET, I’d test Promise.all for handling all resolutions and rejections, and Promise.race to ensure it captures the fastest promise correctly.”

Question 6

How do you handle errors in async/await?

Answer 6

“Errors in async/await are handled using try/catch blocks within an async function, catching errors from awaited promises. This makes error handling cleaner than promise .catch() chains.

For example:

async function fetchData() {
  try {
    const result = await new Promise((resolve, reject) => {
      setTimeout(() => reject('Error occurred'), 1000);
    });
  } catch (error) {
    console.log(error); // Outputs 'Error occurred'
  }
}
fetchData();

You can also use a global .catch() on the async function’s promise if needed. As an SDET, I’d test error scenarios to ensure try/catch handles all rejection cases and verify fallback logic works correctly.”