[Easy] LeetCode JS 30 - 2620. Counter

Question Prompt

Imagine you're working on a project that tracks different metrics. We need a function that acts as a counter, but there's a bit more to it. Can you design a function called makeCounter that takes an optional starting value as an argument? This function should return a new function. Now, here's where it gets interesting: when you call this new function the first time, it should either return the provided starting value (if there was one) or 0 by default. And here's the kicker: any subsequent calls to this new function should return 1 more than the previous call's return value. Remember, we want this behavior to be encapsulated within this new function.

So, can you tell me how you would approach designing and implementing this makeCounter function? What programming concepts would you draw on? How would you handle the optional starting value and ensure the subsequent calls increment correctly? Don't hesitate to ask any clarifying questions if you need more context.

// not passing anything
const counter = makeCounter();
counter(); // 0
counter(); // 1
counter(); // 2

// passing 10
const counter = makeCounter(10);
counter(); // 10
counter(); // 11
counter(); // 12

Solutions

Looking to practice more questions like these? We recommend GreatFrontEnd, the best platform for honing your frontend interview skills!

Using a closure

This solution uses the closure feature of JavaScript to implement the counter functionality. A closure is a technique that allows a function to access variables from its creation context. In this example, the makeCounter() function creates a variable named count and initializes it to initialValue - 1. It then returns a new function that uses the count variable to calculate and return the value of the counter.

When the makeCounter() function is called for the first time, the initialValue parameter will be set to 0. Therefore, the value of the count variable will be -1. When the function returned by the makeCounter() function is called, it will increment the value of the count variable and return it as the return value. Therefore, the function returned by the first call will return 0.

In any subsequent calls, the initialValue parameter will be ignored and the value of the count variable will be inherited from the return value of the previous call. Therefore, each call to the function returned will return a value that is 1 greater than the value returned by the previous call.

Specifically, the thought process behind this answer is as follows:

1. The initialValue parameter of the makeCounter() function is optional. If not provided, it defaults to 0.
2. The return value of the makeCounter() function is a new function.
3. The new function uses the count variable to calculate and return the value of the counter.
4. The initial value of the count variable is the initialValue parameter minus 1.
5. The value of the count variable is incremented by 1 each time the new function is called.

function makeCounter(initialValue = 0) {
  let count = initialValue - 1;

  return () => {
    count += 1;
    return count;
  };
}

We could also use a simpler approach. The key difference is that we initialize the count variable to the value of the initialValue parameter. In this case, we use count++ to increment count after the function returns.