Roadmap › 4. Frontend › Step 43
JS

JavaScript (ES5 → ES2025) & TypeScript Basics

Types, scope, hoisting, closures, this, prototypes, classes, the event loop, promises and async/await, modules, DOM and events, fetch, ES6+ features, error handling, performance, security and TypeScript essentials.
Quick revision for interview day. Print it or save it as a PDF.

Types & equality

Primitives: string, number, bigint, boolean, undefined, null, symbol. Falsy: false, 0, -0, 0n, "", null, undefined, NaN. Use ===. Array.isArray, Number.isNaN, typeof null === "object".

Declarations

const by default · let when reassigning · no var · TDZ for let/const · function declarations fully hoisted.

this

method → object · plain → undefined (strict) · new → instance · call/apply/bind → explicit · arrow → lexical.

Event loop

Sync code → all microtasks (promises, queueMicrotask) → render → next macrotask (setTimeout, events, I/O).

Promises

all (fail fast) · allSettled (all outcomes) · race (first settled) · any (first success) · async/await + try/catch · AbortController.

Array methods

map · filter · reduce · find · findIndex · some · every · includes · flat · flatMap · at · toSorted · Object.groupBy · sort((a,b)=>a-b) (default sort is lexicographic!).

Modern syntax

?. · ?? · ??= · destructuring · spread/rest · template literals · classes with #private · modules · top-level await · structuredClone.

DOM

querySelector(All) · textContent (safe) vs innerHTML (XSS risk) · addEventListener · delegation with closest · bubbling vs capturing · preventDefault / stopPropagation.

Snippets

js
const debounce = (f, ms) => { let t; return (...a) => { clearTimeout(t); t = setTimeout(() => f(...a), ms); }; };
const unique = arr => [...new Set(arr)];
const sleep = ms => new Promise(r => setTimeout(r, ms));
const sum = arr => arr.reduce((s, x) => s + x, 0);
const groupBy = (arr, key) => arr.reduce((acc, x) => ((acc[x[key]] ??= []).push(x), acc), {});