Top Interview 100

Write flatten(values): take an array that can contain other arrays and return a new array containing every non-array value, in its original left-to-right order.

Implement throttle(fn, wait). Invoke immediately when idle, then at most once per wait milliseconds, retaining the latest call for trailing execution.

Build a todo list that lets users add tasks, mark them complete or active, and delete them. Use the selected framework to manage state and render updates.

Implement arrayReduce to recreate the core behavior of Array.prototype.reduce using a loop. Work with a standalone function that receives the array as its first argument.

Implement flattenObject(object). Convert nested object properties into a new flat object whose keys are dot-separated paths. Preserve each leaf value without changing the input. For example, { user: { name: "Ada" } } becomes { "user.name": "Ada" }. Arrays are leaf values in this exercise; use Flatten Array for array flattening.

Implement debounce(fn, wait) with cancel() and flush() methods. Repeated calls postpone execution until wait milliseconds after the most recent call. Users must be able to discard a delayed invocation or run it immediately. This extends the Debounce challenge with explicit control over pending work.

Build a simple user profile card. Fetch the supplied demo API once when the component mounts, save its JSON response in state, and render the name, email, and city. Demo API: GET /api/demo/user on this app. It returns fictional public data: { "id": 1, "name": "Maya Patel", "email": "maya@example.com", "city": "Pune" } . No login or API key is needed. In the sandbox, import APP_ORIGIN from /__frontcrate_api__.js and fetch APP_ORIGIN + "/api/demo/user" . The starter comment includes this URL.

Build a controlled contact form with Name, Email, and Message fields. Keep each field in framework state and update it as the user types. On submission, display a snapshot of the entered values without reloading the page. This is a local form exercise: no API, email delivery, or backend is required. The starter intentionally contains only a form and one empty text input.

Implement classNames(...values) , a utility that joins CSS class names conditionally. Accept class strings, non-zero numbers, conditional objects, and nested arrays, then return one class-name string in traversal order. Objects contribute their enabled keys, arrays recursively contribute their contents, and falsy values contribute nothing. The returned string must have no leading or trailing whitespace.

Implement promiseAll(iterable), a standalone version of Promise.all. It should combine independent asynchronous tasks into one promise, succeeding only when every input succeeds. Accept ordinary values as well as promises and thenables.