A recursive function is any function that calls itself during its execution.

Recursive solutions to a problem can be more declarative than an iterative solution; making it easier to reason about. They are particularly useful when dealing with problems that can be broken down into smaller, easier-to-solve problems¹.

Let’s look at an example of a recursive function to get us going:

```
// n factorial or n! is the product of all positive integers less than n
const factorial = (n) => (n > 1 ? n * factorial(n -1) : 1);
// Example
factorial(5)
5 * factorial(4);
5 * 4 * factorial(3));
5 * 4 * 3 * factorial(2);
5 * 4 * 3 * 2 * factorial(1);
5 * 4 * 3 * 2 * 1;
= 120
view rawrecursion.js hosted with ❤ by GitHub
```

By looking at the example implementation you can see that the interpreter will have to keep all of the stack frames as it recurses until it hits its base case `!(n > 1)`

. At this point it will start to unwind and use the returned values from the recursive calls in calculating the final result.

It’s not a big deal when you’re five levels deep but if you were dealing with larger numbers this would be a really great way to create a Stack Overflow.

**Tail call recursion to the rescue**

To get around this we need to find a way that the final recursive call can perform the final calculation without needing to unwind. To get this right we need to do two things:

- The recursive call must be the last thing the function does (i.e its result can’t be used as an input into the calculation as it is in the n! implementation above)
- We need to keep track of the current state of the calculation in one or more state variables such that the return value from the deepest recursive call is the final answer we’re looking for.

```
const factorial = (n) = {
// We need our function to keep track of the accumulated values
// but writing it like this means we can hide the implementation
// and allow consumers of the function to pass in only n
const implementation = (n, accumulator) = {
// We implement a base case to make sure we don't recurse forever
if (n <= 1) {
// By convention the factorial of 0 is 1
return accumulator;
}
// This recursive call is the last thing that the function performs
return implementation(n - 1, accumulator * n);
}
// We kickstart the recursion with an initial accumulator value
return implementation(n, 1);
};
factorial(5);
implementation(5, 1);
implementation(4, 5);
implementation(3, 20);
implementation(2, 60);
implementation(1, 120)
= 120
view rawtail-call-recursion.js hosted with ❤ by GitHub
```

Looking at the example above, you can see that the current value of the calculation is being passed through in the `accumulator`

variable. This means that the final call to `implementation`

returns the answer we’re looking for and there is no need for the interpreter to keep references to the previous stack frames.

**Tail calls in Javascript**

Now what I said above is only technically true if the runtime your code is executing in implements something called tail-call optimisation.

This is a feature that allows the runtime to recognise that it can discard the intermediate stack frames since the result to the final call can simply replace that entire set of frames.

The good news is that the ES6 language spec requires tail-call optimisation but the bad news is that very few implementations currently support this (only mobile and desktop Safari at the time of writing²). Given the lack of support in even ES6-compliant runtimes, it’s probably wise to keep any code that will receive extremely large inputs as iterative solutions until the implementations can catch up.

## Add comment