JavaScript Async & DOM

When to use this skill

• Manipulating usage of fetch or XMLHttpRequest.
• Adding event listeners to DOM elements.
• Interacting with browser APIs (Local Storage, Navigator).

1. Async Data Fetching

• Fetch API: Use fetch() with async/await. Always check res.ok before parsing JSON.

  const res = await fetch('/api/data');
  if (!res.ok) throw new Error('Failed');
  const data = await res.json();
  

• AbortController: Use AbortController to cancel pending requests when components unmount or fast interactions occur.