Vibe coder or product engineer coding interview questions

As asked

You are building a product feature that needs to find pairs of items in a user's data list that together meet a target value, for example matching two expense line items that sum to a budget target. Implement a solution and explain the time and space complexity tradeoffs, including why you would not reach for a brute-force nested loop in a user-facing feature.

Sample answer outline

Use a hash map to store each value and its index as you iterate. For each element, check if target minus that element exists in the map. This runs in O(n) time and O(n) space. The brute force O(n^2) solution with nested loops is worth mentioning as the naive approach to contrast.

Reference implementation (typescript)

function twoSum(nums: number[], target: number): number[] {
  const seen = new Map<number, number>();
  for (let i = 0; i < nums.length; i++) {
    const complement = target - nums[i];
    if (seen.has(complement)) {
      return [seen.get(complement)!, i];
    }
    seen.set(nums[i], i);
  }
  return [];
}

Expect these follow-ups

• How does your solution change if the array is sorted and you want O(1) space?
• How would you return all pairs, not just the first?

As asked

Implement a debounce function in TypeScript. It should take a function and a delay in milliseconds and return a new function that delays invoking the original until after the delay has elapsed since the last time it was called. This is a staple in product UIs for search inputs.

Sample answer outline

Use a closure to hold the timer ID, clear it on each call, and set a new timeout. Return a function that captures the correct arguments and 'this' context. A strong answer also adds a cancel method on the returned function and discusses the difference between debounce and throttle.

Reference implementation (typescript)

function debounce<T extends (...args: unknown[]) => unknown>(
  fn: T,
  delay: number
): (...args: Parameters<T>) => void {
  let timer: ReturnType<typeof setTimeout>;
  return function (...args: Parameters<T>) {
    clearTimeout(timer);
    timer = setTimeout(() => fn(...args), delay);
  };
}

Expect these follow-ups

• How would you add a leading-edge option so the function fires immediately on the first call and then debounces subsequent ones?

As asked

Implement a small optimistic UI helper for a feature toggle. It should update immediately, call the server, and roll back if the request fails.

Sample answer outline

The core is to separate the previous state, optimistic state, server confirmation, and rollback path. A good candidate handles concurrent clicks by either disabling while pending or tracking request order so stale responses do not overwrite newer intent. The code should surface an error path the UI can show, not silently swallow failures. Interviewers want pragmatic product engineering: instant feedback without corrupting state. Common mistakes include not restoring the previous value, ignoring rejected promises, or allowing double toggles to race.

Reference implementation (typescript)

type SaveToggle = (enabled: boolean) => Promise<void>;

export async function applyOptimisticToggle(
  current: boolean,
  setEnabled: (next: boolean) => void,
  saveToggle: SaveToggle,
): Promise<void> {
  const next = !current;
  setEnabled(next);

  try {
    await saveToggle(next);
  } catch (error) {
    setEnabled(current);
    throw error;
  }
}

Expect these follow-ups

• How would you handle two rapid clicks before the first request returns?
• What changes if this value is also updated by another browser tab?
• Where would you put analytics for successful and failed toggles?

As asked

Write a function that takes an arbitrarily nested JavaScript object and returns a flat object where each key is the full dot-notation path to the original leaf value. This comes up when parsing config or analytics event payloads.

Sample answer outline

Use a recursive helper that builds the path prefix as it descends. At each level, check if the value is a plain object and recurse with an updated prefix, or assign the value at the current path if it is a leaf. Edge cases include arrays, null values, and keys that themselves contain dots.

Reference implementation (typescript)

function flatten(
  obj: Record<string, unknown>,
  prefix = ''
): Record<string, unknown> {
  const result: Record<string, unknown> = {};
  for (const [key, value] of Object.entries(obj)) {
    const path = prefix ? `${prefix}.${key}` : key;
    if (value !== null && typeof value === 'object' && !Array.isArray(value)) {
      Object.assign(result, flatten(value as Record<string, unknown>, path));
    } else {
      result[path] = value;
    }
  }
  return result;
}

Expect these follow-ups

• How would you handle arrays in the nested object? Would you flatten them as 0, 1, 2 index keys?

As asked

Implement an LRU (Least Recently Used) cache class with a fixed capacity. It should support get(key) and put(key, value) in O(1) time. This pattern comes up in product feature caches and memoisation utilities.

Sample answer outline

JavaScript's Map preserves insertion order, so deleting and re-inserting a key moves it to the end. Use this to track recency: on get or put, delete then re-insert the key. On put when at capacity, delete the first key of the Map (Map.keys().next().value), which is the least recently used. This achieves O(1) for all operations without a linked list.

Reference implementation (typescript)

class LRUCache {
  private capacity: number;
  private cache: Map<number, number>;
  constructor(capacity: number) {
    this.capacity = capacity;
    this.cache = new Map();
  }
  get(key: number): number {
    if (!this.cache.has(key)) return -1;
    const val = this.cache.get(key)!;
    this.cache.delete(key);
    this.cache.set(key, val);
    return val;
  }
  put(key: number, value: number): void {
    if (this.cache.has(key)) this.cache.delete(key);
    else if (this.cache.size >= this.capacity)
      this.cache.delete(this.cache.keys().next().value!);
    this.cache.set(key, value);
  }
}

Expect these follow-ups

• How does your implementation change if you need the cache to be thread-safe for concurrent async operations?

As asked

Implement a function myPromiseAll that behaves like Promise.all: it takes an array of promises and resolves with an array of results in the same order when all resolve, or rejects immediately if any reject. This tests your understanding of async patterns critical in product code.

Sample answer outline

Create a new Promise. Track a results array and a counter. For each input promise, attach a then handler that stores the resolved value at the correct index and decrements the counter, resolving the outer promise when the counter reaches zero. Any rejection immediately rejects the outer promise. The key subtlety is preserving order using the index from the forEach, not the order in which promises resolve.

Reference implementation (typescript)

function myPromiseAll<T>(promises: Promise<T>[]): Promise<T[]> {
  return new Promise((resolve, reject) => {
    const results: T[] = new Array(promises.length);
    let remaining = promises.length;
    if (remaining === 0) return resolve(results);
    promises.forEach((p, i) => {
      Promise.resolve(p).then(val => {
        results[i] = val;
        if (--remaining === 0) resolve(results);
      }).catch(reject);
    });
  });
}

Expect these follow-ups

• How would you implement Promise.allSettled, which never rejects and always returns the status of each promise?

As asked

Write a groupBy function that takes an array of objects and a key name, and returns an object where each key is a distinct value of that field and each value is the array of items matching that field. This is a common data transformation in product dashboards.

Sample answer outline

Use Array.prototype.reduce to build the accumulator object. For each item, read the grouping key value, initialise the array if it does not exist, and push the item. A stronger answer types the function generically so the key is constrained to be a keyof T.

Reference implementation (typescript)

function groupBy<T extends Record<string, unknown>>(
  items: T[],
  key: keyof T
): Record<string, T[]> {
  return items.reduce<Record<string, T[]>>((acc, item) => {
    const groupKey = String(item[key]);
    if (!acc[groupKey]) acc[groupKey] = [];
    acc[groupKey].push(item);
    return acc;
  }, {});
}

Expect these follow-ups

• How would you extend this to group by the result of an arbitrary function rather than a fixed key name?

As asked

Your product has a sorted log of timestamped events and you need to find the first event at or after a given timestamp as efficiently as possible. Given a sorted array that may contain duplicates, write a function that returns the index of the first occurrence of a target value, or -1 if not present. Walk through your approach and explain why standard binary search needs adjusting for this case.

Sample answer outline

Run standard binary search but when nums[mid] === target do not return immediately. Instead record mid as a candidate and move high to mid - 1 to keep searching left for an earlier occurrence. Return the candidate at the end or -1 if never found. A strong answer also mentions the invariant they maintain and why this is still O(log n).

Reference implementation (typescript)

function firstOccurrence(nums: number[], target: number): number {
  let lo = 0, hi = nums.length - 1, result = -1;
  while (lo <= hi) {
    const mid = (lo + hi) >>> 1;
    if (nums[mid] === target) {
      result = mid;
      hi = mid - 1;
    } else if (nums[mid] < target) {
      lo = mid + 1;
    } else {
      hi = mid - 1;
    }
  }
  return result;
}

Expect these follow-ups

• How would you also find the last occurrence in the same pass or a second pass?
• What changes if the array is rotated?

As asked

Implement an EventEmitter class in TypeScript with on(event, listener), off(event, listener), and emit(event, ...args) methods. This tests understanding of the observer pattern which underpins most product UI frameworks.

Sample answer outline

Use a Map from event name to Set or Array of listeners. on adds a listener, off removes it, emit calls all listeners for the event with the provided args. Using a Set makes off O(1) but loses call order; an Array preserves order. A strong answer also adds an once method that wraps the listener in a self-removing wrapper.

Reference implementation (typescript)

class EventEmitter {
  private listeners = new Map<string, Set<Function>>();
  on(event: string, fn: Function): this {
    if (!this.listeners.has(event)) this.listeners.set(event, new Set());
    this.listeners.get(event)!.add(fn);
    return this;
  }
  off(event: string, fn: Function): this {
    this.listeners.get(event)?.delete(fn);
    return this;
  }
  emit(event: string, ...args: unknown[]): boolean {
    const fns = this.listeners.get(event);
    if (!fns || fns.size === 0) return false;
    fns.forEach(fn => fn(...args));
    return true;
  }
}

Expect these follow-ups

• How would you add a wildcard listener that fires on any event?

As asked

Given an array of integers and a number K, find the maximum sum of any contiguous subarray of size K. Walk me through a sliding window approach and its time complexity. This pattern applies directly to product analytics dashboards computing rolling averages.

Sample answer outline

Compute the sum of the first K elements, then slide the window by subtracting the element leaving the left side and adding the element entering the right side. Track the max sum seen. This is O(n) time and O(1) space versus O(n*k) for the brute force nested loop.

Reference implementation (typescript)

function maxSumSubarray(nums: number[], k: number): number {
  let windowSum = nums.slice(0, k).reduce((a, b) => a + b, 0);
  let max = windowSum;
  for (let i = k; i < nums.length; i++) {
    windowSum += nums[i] - nums[i - k];
    max = Math.max(max, windowSum);
  }
  return max;
}

Expect these follow-ups

• How does this extend to a variable-size window where you want the smallest subarray with sum >= target?

As asked

Write a deepEqual function that returns true if two values are deeply equal, handling nested objects, arrays, null, and primitives. Do not use JSON.stringify. This is used in testing utilities and memoisation logic in product code.

Sample answer outline

Handle the primitive fast path with strict equality. Check for null and type mismatches. For arrays, compare lengths and recurse on each index. For objects, compare keys count, then recurse on each value. Avoid JSON.stringify because it cannot handle undefined values, circular references, or non-standard key ordering.

Reference implementation (typescript)

function deepEqual(a: unknown, b: unknown): boolean {
  if (a === b) return true;
  if (a === null || b === null) return false;
  if (typeof a !== typeof b) return false;
  if (Array.isArray(a) && Array.isArray(b)) {
    if (a.length !== b.length) return false;
    return a.every((v, i) => deepEqual(v, b[i]));
  }
  if (typeof a === 'object' && typeof b === 'object') {
    const keysA = Object.keys(a as object);
    const keysB = Object.keys(b as object);
    if (keysA.length !== keysB.length) return false;
    return keysA.every(k =>
      deepEqual((a as Record<string,unknown>)[k], (b as Record<string,unknown>)[k])
    );
  }
  return false;
}

Expect these follow-ups

• How would you handle circular references without throwing a stack overflow?

As asked

Write an async retry utility that calls an async function up to N times with exponential backoff between attempts and a jitter factor, throwing the last error if all attempts fail. This is a core building block for resilient API calls in product code.

Sample answer outline

Use a loop rather than recursion to avoid stack buildup. On each failure, compute the delay as baseDelay * 2^attempt plus random jitter, wait with a sleep helper using setTimeout wrapped in a Promise, and rethrow on the last attempt. A strong answer also mentions not retrying on 4xx errors since those are client errors that will not resolve on retry.

Reference implementation (typescript)

async function retry<T>(
  fn: () => Promise<T>,
  attempts: number,
  baseDelay = 200
): Promise<T> {
  let lastError: unknown;
  for (let i = 0; i < attempts; i++) {
    try {
      return await fn();
    } catch (err) {
      lastError = err;
      if (i < attempts - 1) {
        const delay = baseDelay * 2 ** i + Math.random() * 100;
        await new Promise(r => setTimeout(r, delay));
      }
    }
  }
  throw lastError;
}

Expect these follow-ups

• How would you add a timeout per attempt so a slow request does not consume the entire retry budget?