Easy frontend interview questions

Build an accordion component with stacked sections whose content panels expand and collapse on click.

Implement findLast and findLastIndex — scan an array from the end for the last element matching a predicate.

Implement lodash xor — return the values that appear in exactly one of the given arrays, with duplicates removed.

Implement Array.prototype.myAt — return the element at a given index, supporting negative offsets from the end.

Implement Array.prototype.every — return false as soon as an element fails the predicate, true when empty.

Implement Array.prototype.filter from scratch as a method on the array prototype.

Implement Array.prototype.flat — flatten nested arrays to a given depth (default 1, Infinity for all levels), dropping holes.

Implement Array.prototype.forEach — run a callback on each element as (value, index, array), skipping sparse holes.

Implement Array.prototype.includes — test membership with SameValueZero so NaN matches, honoring negative fromIndex.

Implement Array.prototype.indexOf — first index of a value by strict equality, supporting a negative fromIndex.

Implement Array.prototype.some — return true as soon as any element passes the predicate, false when empty.

Implement a custom Array.prototype.square method that returns a new array with each value squared.

Implement a countdown latch whose wait resolves once countDown has been called the required number of times.

Build a row of overlapping avatars that collapses the overflow into a plus-N badge.

Implement a function that checks whether a string of brackets is properly opened and closed in order.

Build an autocomplete input that filters a static list and lets you pick a suggestion.

Implement a function that returns whether two binary trees have identical structure and node values.

Implement a function that returns the maximum depth from root to leaf in a binary tree.

Implement a function that reverses the order of the bits in the binary representation of a number.

Build a breadcrumb trail from a path array, separating crumbs and marking the current page.

Implement bubble sort, repeatedly swapping adjacent out-of-order pairs until the array is sorted.

Implement a setInterval wrapper that returns a function which stops the interval when invoked.

Implement a setTimeout wrapper that returns a function you can call to cancel the pending callback.

Build a textarea with a live character counter that warns as it nears a maximum length.

Implement a function that splits an array into groups of a given size, with the last group holding the remainder.

Implement a function that constrains a number to lie within an inclusive minimum and maximum range.

Build a swatch color picker where clicking a swatch selects it and previews the chosen color.

Implement a function that merges two sorted linked lists into a single sorted linked list.

Implement a function that returns a new array with every falsy value stripped out.

Implement a function that composes functions right-to-left so the output of each feeds into the next.

Build a contact form that posts the user's name, email, and message to a backend endpoint.

Implement get/set/remove over document.cookie, handling encoding and expiry.

Build a button that copies text to the clipboard and shows a transient copied confirmation.

Implement a function that counts the number of 1 bits in the binary representation of an integer.

Build a countdown timer that ticks down from a start time and can start, pause, and reset.

Build a counter component that increments a displayed number each time a button is clicked.

Fetch successive pages with an opaque cursor, accumulating items and tracking whether more remain.

Implement a function that, given several values, returns a function that yields each one in turn and loops forever.

Implement a function that consolidates rows sharing the same user into a single grouped record.

Implement a function that delays invoking another function until a specified period of inactivity has passed.

Implement a deep clone of a DOM node and its subtree (element, text, and attributes) without cloneNode.

Implement a function that returns the elements from the first array that do not appear in the second.

Implement a function that returns the height (max depth) of a DOM element's subtree.

Implement a function that drops trailing array elements as long as a predicate keeps returning truthy.

Implement a function that drops leading array elements as long as a predicate keeps returning truthy.

Implement a delegated event listener that matches events bubbling up from descendants against a selector.

Build a list of FAQ questions that each expand to reveal an answer on click.

Implement a function that replaces array elements with a given value between an optional start and end index.

Implement a function that checks whether an array contains any duplicate numbers.

Implement a function that returns the index of the first array element matching a predicate, or -1 if none match.

Implement a function that returns the index of the last array element matching a predicate, or -1 if none match.

Implement a function that returns the single missing number from a sorted sequence of integers.

Find the first failing version among 1..n where a monotonic isBad check flips from false to true — a boundary binary search using the fewest checks.

Build a small form that books either a one-way or return flight, with validation tying the two date fields together.

Implement a function that mirrors a binary tree by swapping the left and right children of every node.

Implement a function that builds an object from an array of [key, value] pair tuples.

Implement a function that returns the number of declared parameters of a given function.

Implement a function that builds a unique CSS selector path from the root to a given element.

Build a component that renders a table of sequential numbers given a row count and a column count.

Implement a function returning the set of distinct tag names used in a DOM subtree, in document order.

Build the classic holy grail page layout with a header, footer, and three columns of content.

Implement a function that checks whether a number lies within a half-open range, swapping bounds when needed.

Implement insertion sort by building the sorted portion one element at a time from the input.

Implement a function that returns the unique values present in every input array.

Implement a jQuery-style helper that gets or sets inline CSS properties on a DOM element.

Implement lodash keyBy — index a collection into an object keyed by an iteratee's return, keeping the last item for each key.

Build a Like button that toggles between liked and unliked states with matching visual feedback.

Implement a function that reverses a singly linked list in place and returns the new head.

Implement a function that joins an array of strings into a grammatical list with commas and a conjunction.

Implement a factory that takes a starting integer and returns a function that returns the next value on each call.

Implement Map.groupBy — group an iterable into a Map whose keys can be any value, preserving key insertion order.

Implement a function that returns the array element producing the largest value when run through an iteratee.

Implement a function that computes the arithmetic mean of the numbers in an array.

Implement a function that determines whether a person can attend every meeting given their time intervals.

Implement a function that returns the array element producing the smallest value when run through an iteratee.

Build a reusable modal dialog component that you can open from a trigger and close with a button.

Build a calculator that computes the monthly payment for a loan based on principal, rate, and term inputs.

Move all zeroes to the end of an array in place while keeping the non-zero elements in their original order.

Implement a function that finds the element immediately to the right of a target at the same tree depth.

Implement nth — return the element at index n, counting from the end when n is negative, so head is nth(0) and last is nth(-1).

Implement a function that returns the count of arguments passed to it at call time.

Implement a function that returns a new object with every value transformed by a mapper callback.

Implement Object.entries — return an object's own enumerable string-keyed [key, value] pairs in insertion order.

Implement Object.fromEntries — build an object from any iterable of [key, value] pairs, with later keys winning.

Implement Object.is — same-value equality that treats NaN as equal to itself and keeps +0 distinct from -0.

Implement a function that wraps a callback so it runs at most one time and reuses that result thereafter.

Implement a function that computes the maximum profit obtainable from one buy and one sell of a stock.

Build pagination controls with previous/next and numbered pages that report the current page.

Implement a function that finds two numbers in an array that add up to a given target.

Build a password field with a live strength meter that scores the input as you type.

Build a progress bar component that visualizes the percentage completion of an operation.

Build a component that renders a list of progress bars which animate from empty to full as they mount.

Run async tasks in sequence, feeding each result into the next, stopping the chain on the first rejection.

Implement Promise.race so it settles with the outcome of whichever input promise settles first.

Implement a function that returns a Promise already rejected with the given reason.

Build a queue data structure supporting enqueue, dequeue, peek, and size in FIFO order.

Implement a function that builds an array of numbers from start up to end, stepping by a given increment.

Implement a function that builds an array of numbers from end down to start in descending order.

Convert a Roman numeral string to its integer value, handling subtractive pairs like IV and IX.

Build a segmented control where clicking a segment selects it and highlights the active option.

Implement selection sort to order an array by repeatedly picking the smallest remaining element.

Implement a function that returns the element count of any collection — array, string, object, Map, or Set.

Implement a function that returns a promise resolving after the specified number of milliseconds.

Implement a cache whose entries expire a fixed time after their last access, not after being set.

Build a stack data structure that supports the standard push, pop, peek, and size operations.

Implement a function that counts the distinct ways to climb to the top of a staircase taking one or two steps.

Implement a function that determines whether two strings are anagrams of each other.

Implement a function that returns whether a string reads the same forwards and backwards.

Implement String.prototype.padStart — pad a string to a target length on the left, truncating a multi-char pad.

Implement String.prototype.repeat — join a string n times, throwing RangeError on a negative or infinite count.

Implement String.prototype.trim — strip leading and trailing whitespace, including Unicode whitespace, from a string.

Implement lodash sumBy and meanBy — total and average an array by an iteratee that maps each element to a number.

Implement take and takeWhile — grab the leading n elements, or the leading run that satisfies a predicate.

Build a widget that converts between Celsius and Fahrenheit, updating either field as the other changes.

Implement a function that wraps occurrences of a search term within a string in highlight markup.

Implement times — invoke a function n times and collect the results into an array.

Build a toast that appears on trigger and auto-dismisses after a few seconds, with manual close.

Build an on/off toggle switch that flips state on click and slides its knob to reflect it.

Build a tooltip that shows on hover/focus of a trigger and hides on leave/blur.

Build a traffic light that cycles green to yellow to red on a timer and loops indefinitely.

Implement a breadth-first traversal of a DOM tree, returning elements level by level.

Build a static tweet component that mirrors the layout of a single post on Twitter.

Implement a set of helper functions that report the primitive type of any JavaScript value.

Buffer bursty streamed text and emit it one character at a time at a steady cadence, with flush and stop controls.

Implement a function that returns a new array with duplicate values removed while preserving original order.

Implement a hook that exposes a boolean value alongside setTrue, setFalse, and toggle helpers.

Implement a hook that fires a callback whenever the user clicks anywhere in the window, cleaning up on unmount.

Implement a hook returning the last copied text and an async copy function built on the Clipboard API.

Implement a hook that exposes a numeric count along with increment, decrement, and reset helpers.

Rewrite useCounter so the returned helpers keep stable identities across renders.

Implement a hook that returns the current value of a sequence and advances to the next on demand.

Implement a hook that steps through an array with wraparound, exposing the current item and next/prev/set.

Implement a hook that falls back to a default value whenever the underlying state becomes null or undefined.

Implement a hook that sets document.title and restores the previous title when the component unmounts.

Implement a hook that runs the given effect a single time after mount, regardless of subsequent renders.

Implement a hook that swaps the page favicon imperatively to a given URL.

Implement a hook that exposes a ref plus a function to focus the attached element on demand.

Implement a hook that reports whether a referenced element is currently being hovered.

Implement a hook that returns true only on the first render and false on every render after.

Implement a hook returning a function that reports whether the component is still mounted, to guard async setState.

Implement a hook that returns a ref always holding the newest value, so callbacks and effects can read it without going stale.

Implement a useState-like hook that persists to localStorage, with SSR-safe init and cross-tab sync.

Implement a hook that holds an object in state and exposes helpers to merge updates or reset its value.

Implement a hook that remembers and returns the value a state held on the previous render.

Implement a hook that counts how many times a component has rendered, without causing extra renders.

Implement a useState-like hook backed by sessionStorage, with a graceful fallback when it is unavailable.

Implement a hook that stores a Set in state and exposes add, delete, has, and clear helpers.

Implement a useState-like hook that also returns a reset function which restores the initial value.

Implement a hook that holds a boolean and returns a stable toggle function to flip its value.

Implement a useEffect variant that skips the first render and fires only on subsequent updates.

Implement a hook that returns the current window width and height, updating on resize.

Implement without — return a copy of an array with the given values excluded, matched by SameValueZero.