DSA Cheat Sheet for Frontend
Read the problem · think it through · then reveal the solution
💻 Core Concepts
What Makes Frontend DSA Unique
Must-Know Implementations
All problems below are JavaScript-only patterns.
🎯 Top Problems
Debounce
Implement `debounce(fn, delay)` — returns a new function that only fires `fn` after `delay` ms have elapsed since the last call. Every new call resets the timer. Core pattern for search inputs and resize handlers.
⏱ Time: O(1) · 📦 Space: O(1)
Try it yourself first
Give it a shot, then reveal the solution
Throttle
Implement `throttle(fn, interval)` — returns a function that can be called at most once per `interval` ms, ignoring calls in the cooldown window. Core pattern for scroll, resize, and mousemove handlers.
⏱ Time: O(1) · 📦 Space: O(1)
Try it yourself first
Give it a shot, then reveal the solution
Deep Clone
Implement `deepClone(obj)` that creates a fully independent deep copy of a value — nested objects, arrays, Maps, Sets, Dates, and circular references should all be handled correctly.
⏱ Time: O(n) · 📦 Space: O(n)
Try it yourself first
Give it a shot, then reveal the solution
Memoize
Implement `memoize(fn)` — returns a cached version of `fn`. Subsequent calls with the same arguments return the cached result instantly without re-executing `fn`. Handle multiple arguments correctly.
⏱ Time: O(1) cached · 📦 Space: O(n)
Try it yourself first
Give it a shot, then reveal the solution
Curry
Implement `curry(fn)` — transforms a function of `n` arguments into a chain of n unary functions. `curry(add)(1)(2)(3)` should equal `add(1, 2, 3)`. Support partial application at each step.
⏱ Time: O(1) · 📦 Space: O(n)
Try it yourself first
Give it a shot, then reveal the solution
Promise.all Polyfill
Implement `promiseAll(promises)` — resolves with an array of all resolved values (in order) when every promise resolves, or rejects immediately when any single promise rejects.
⏱ Time: O(n) · 📦 Space: O(n)
Try it yourself first
Give it a shot, then reveal the solution
Event Emitter (Pub/Sub)
Implement an `EventEmitter` class with `on(event, listener)`, `off(event, listener)`, `emit(event, ...args)`, and `once(event, listener)`. The `once` listener should fire exactly once then auto-remove.
⏱ Time: O(n) emit · 📦 Space: O(n)
Try it yourself first
Give it a shot, then reveal the solution
Trie (Autocomplete)
Implement a Trie with `insert(word)`, `search(word)` (exact match), and `startsWith(prefix)`. Used as the backbone for autocomplete, spell-checkers, and prefix-search features.
⏱ Time: O(m) per op · 📦 Space: O(n·m)
Try it yourself first
Give it a shot, then reveal the solution
Flatten Nested Array
Implement `flatten(arr, depth)` that flattens a nested array to the given depth without using `Array.flat()`. `depth = Infinity` means fully flatten. Example: `[1,[2,[3,[4]]]]` → `[1,2,3,4]`.
⏱ Time: O(n) · 📦 Space: O(d)
Try it yourself first
Give it a shot, then reveal the solution
Implement pipe / compose
Implement `pipe(...fns)` that returns a function applying `fns` left-to-right — each function receives the output of the previous. Also implement `compose(...fns)` which applies right-to-left.
⏱ Time: O(n) · 📦 Space: O(1)
Try it yourself first
Give it a shot, then reveal the solution
Virtual DOM diff (basic)
Implement a minimal `createElement(type, props, ...children)` and `render(vnode, container)` that converts a virtual DOM tree to real DOM. Bonus: implement `diff(oldVNode, newVNode)` to compute patches.
⏱ Time: O(n) · 📦 Space: O(n)
Try it yourself first
Give it a shot, then reveal the solution