Solution Approach

Let's walk through the implementation step by step:

1. Function Signature

function debounce(fn: F, t: number): F

The debounce function accepts the original function fn and delay time t, and returns a new function of the same type.

2. Timer Storage Using Closure

let timeout: ReturnType<typeof setTimeout> | undefined;

We declare a variable to store the timer ID outside the returned function but inside the debounce function. This creates a closure - the returned function will have access to this variable across multiple calls. Initially, it's undefined to indicate no pending execution.

3. Return the Debounced Function

return function (...args) {  // implementation };

We return an anonymous function that accepts any number of arguments using the rest parameter ...args. This ensures we can handle functions with any parameter signature.

4. Cancel Previous Timer (if exists)

if (timeout !== undefined) {  clearTimeout(timeout); }

Before scheduling a new execution, we check if there's an existing timer. If there is, we cancel it using clearTimeout. This is the core debouncing behavior - cancelling the previous scheduled execution when a new call comes in.

5. Schedule New Execution

timeout = setTimeout(() => {  fn.apply(this, args); }, t);

We create a new timer that will execute after t milliseconds and store its ID in the timeout variable. Inside the timer callback:

• fn.apply(this, args) executes the original function
• this preserves the context from when the debounced function was called
• args passes all the arguments from the most recent call

Data Structure Pattern: The solution uses the Closure Pattern to maintain state between function calls. The timeout variable acts as a simple state container that persists across invocations.

Algorithm Flow:

1. First call: timeout is undefined, skip cancellation, schedule execution
2. Subsequent call within t ms: Cancel previous timer, schedule new execution
3. If no calls for t ms: Timer completes, function executes
4. Cycle repeats for future calls

This implementation ensures that the function only executes when there's been a "quiet period" of at least t milliseconds with no new calls.

Example Walkthrough

Let's walk through a concrete example to see how debouncing works in practice.

Setup:

// Original function that logs a greeting function greet(name) {  console.log(`Hello, ${name}!`); }  // Create debounced version with 50ms delay const debouncedGreet = debounce(greet, 50);

Timeline of calls:

// Time 0ms: First call debouncedGreet("Alice"); // → Timer A scheduled for 50ms  // Time 20ms: Second call (within 50ms window) debouncedGreet("Bob"); // → Timer A cancelled // → Timer B scheduled for 70ms (20 + 50)  // Time 30ms: Third call (still within window) debouncedGreet("Charlie"); // → Timer B cancelled // → Timer C scheduled for 80ms (30 + 50)  // Time 80ms: Timer C completes // → Executes: greet("Charlie") // → Output: "Hello, Charlie!"

What happened internally:

1. First call at 0ms:

   • timeout is undefined (no previous timer)
   • Skip cancellation step
   • Create Timer A to execute at 50ms
   • Store Timer A's ID in timeout

2. Second call at 20ms:

   • timeout contains Timer A's ID
   • Cancel Timer A with clearTimeout(timeout)
   • Create Timer B to execute at 70ms
   • Update timeout with Timer B's ID
   • Note: "Alice" is forgotten; we now have "Bob"

3. Third call at 30ms:

   • timeout contains Timer B's ID
   • Cancel Timer B with clearTimeout(timeout)
   • Create Timer C to execute at 80ms
   • Update timeout with Timer C's ID
   • Note: "Bob" is forgotten; we now have "Charlie"

4. At 80ms:

   • No new calls came in to interrupt
   • Timer C completes
   • fn.apply(this, args) executes with args = ["Charlie"]
   • Output: "Hello, Charlie!"

Key observations:

• Only the last call's arguments ("Charlie") were used
• The first two calls never executed because they were cancelled
• The function only ran once, after the "quiet period" of 50ms
• The total delay from first call to execution was 80ms (much longer than the 50ms delay) because calls kept resetting the timer

This demonstrates the core debouncing behavior: rapid successive calls result in only one execution with the most recent arguments, after the specified delay from the last call.

Time and Space Complexity

Time Complexity: O(1) for each function call

The debounce function itself executes in constant time for each invocation:

• Checking if timeout !== undefined is O(1)
• Calling clearTimeout() is O(1)
• Setting up a new timeout with setTimeout() is O(1)
• The actual execution of the wrapped function fn happens asynchronously and its complexity depends on the function being debounced, but the debounce wrapper operations themselves are all constant time

Space Complexity: O(1)

The space usage remains constant regardless of input:

• The closure maintains a single timeout variable that persists between calls
• The args array reference is stored but not copied (just a reference to the arguments passed)
• Each call either clears the previous timeout or creates a new one, but only one timeout exists at any given time
• The closure itself occupies constant space in memory

Note that if multiple debounced functions are created, each maintains its own closure with its own timeout variable, but for a single debounced function instance, the space complexity remains O(1).

Common Pitfalls

1. Loss of Return Values

The debounced function returns None instead of the original function's return value. This is a fundamental limitation because the function executes asynchronously after a delay, making it impossible to return the result synchronously.

Problem Example:

def calculate(x, y):  return x + y  debounced_calc = debounce(calculate, 100) result = debounced_calc(5, 3) # result is None, not 8

Solution: Use callbacks or promises/futures to handle results:

from concurrent.futures import Future import threading  def debounce_with_future(fn, t):  timer_obj = None  future_obj = None   def debounced_function(*args, **kwargs):  nonlocal timer_obj, future_obj   if timer_obj is not None:  timer_obj.cancel()  if future_obj:  future_obj.cancel()   future_obj = Future()   def execute():  try:  result = fn(*args, **kwargs)  future_obj.set_result(result)  except Exception as e:  future_obj.set_exception(e)   timer_obj = threading.Timer(t / 1000, execute)  timer_obj.start()  return future_obj   return debounced_function

2. Context (self) Binding Issues in Class Methods

When debouncing instance methods, the self context can be lost or incorrectly bound.

Problem Example:

class Counter:  def __init__(self):  self.count = 0  self.increment = debounce(self.increment, 100) # Wrong!   def increment(self):  self.count += 1  print(f"Count: {self.count}")  counter = Counter() # RecursionError or AttributeError

Solution: Create the debounced method properly:

class Counter:  def __init__(self):  self.count = 0  self._increment = self.increment_impl  self.increment = debounce(self.increment_impl, 100)   def increment_impl(self):  self.count += 1  print(f"Count: {self.count}")

3. Memory Leaks with Long-Running Timers

If a debounced function is called but the timer never completes (e.g., the function keeps getting called), the timer threads accumulate without being properly cleaned up.

Problem Example:

# In a loop that runs frequently for i in range(10000):  debounced_func(i) # Creates 10000 timer threads  time.sleep(0.001) # Each call cancels the previous

Solution: Add cleanup mechanism:

def debounce_with_cleanup(fn, t):  timer_obj = None   def debounced_function(*args, **kwargs):  nonlocal timer_obj   if timer_obj is not None:  timer_obj.cancel()  timer_obj.join(timeout=0.001) # Wait for thread cleanup   timer_obj = threading.Timer(t / 1000, fn, args=args, kwargs=kwargs)  timer_obj.daemon = True # Ensure thread doesn't prevent program exit  timer_obj.start()   # Add cleanup method  debounced_function.cancel = lambda: timer_obj.cancel() if timer_obj else None   return debounced_function

4. Thread Safety Issues

Multiple threads calling the debounced function simultaneously can cause race conditions when accessing and modifying the timer_obj.

Problem Example:

debounced_print = debounce(print, 100)  # Multiple threads calling simultaneously thread1 = threading.Thread(target=lambda: debounced_print("Thread 1")) thread2 = threading.Thread(target=lambda: debounced_print("Thread 2")) thread1.start() thread2.start() # Race condition: timer_obj might be accessed/modified simultaneously

Solution: Add thread synchronization:

def debounce_thread_safe(fn, t):  timer_obj = None  lock = threading.Lock()   def debounced_function(*args, **kwargs):  nonlocal timer_obj   with lock:  if timer_obj is not None:  timer_obj.cancel()   timer_obj = threading.Timer(t / 1000, fn, args=args, kwargs=kwargs)  timer_obj.start()   return debounced_function