ES6 Trampoline Function

In this article, we will try to understand each and every aspect associated with Trampoline function in ES6 in as much detailed manner as possible. Let us first understand what actually went wrong while working with Recursion, followed by understanding the Tail Recursion concept and thereafter we will understand what’s the exact need to introduce another function called Trampoline function in ES6.

What went wrong with Recursion?

Recursion is the phenomenon or a process wherein we calculate any result value through the same function itself but by making several different function calls which are managed by/under Stack data structure. Recursion actually makes the code more simpler and for larger values it actually solves the resulting piece by piece (that is value by value).

Example: Let us see the below code snippet to understand Recursion in a much quicker as well as inefficient manner.

Javascript

let sumCalculation = (num) => {
  let sum = 0;
  return num === 0 ? sum : num + sum + sumCalculation(num - 1);
};

console.log(sumCalculation(5));
console.log(sumCalculation(13));

Output:

15
91

Example: Following shown snippet illustrates the execution of the above shown recursive code.

sumCalculation(5){
    sum = 5
        sumCalculation(4) {
            sum = 5 + 4 
                sumCalculation(3){
                    sum = 5 + 4 + 3
                        sumCalculation(2){
                            sum = 5 + 4 + 3 + 2
                                sumCalculation(1){
                                    sum = sum = 5 + 4 + 3 + 2 + 1
                                        sumCalculation(0){
                                            // Returns sum = 15
                                            // Exist all function calls
                                        }
                                }
                        }
                }
        }
}

Now as illustrated above, so many function calls would be made, and thus for larger input size result in the console’s output might come as “Range Error: Maximum call stack size exceeded”.

Now in order to eliminate this error, one important concept comes into the picture which is Tail Recursion (explained below).

Tail Recursion: This is the phenomenon or process, which is different from regular recursion, in which instead of passing a function as an operand we pass in the changing result in the next recursive step. This particular process helps to prevent the stack overflow but there is one more problem which is associated with it which will be described in the later part of this section.

Example: Following code snippet will make things more clear.

Javascript

let sumCalculation = (num) => {
  let sumRecursiveCalculation = (result, num) => {
    return num === 1 ? result : sumRecursiveCalculation(result + num, num - 1);
  };
  return sumRecursiveCalculation(1, num);
};

console.log(sumCalculation(5));
console.log(sumCalculation(15));

Output:

15
120

Now here the problem that exists which is that Tail Recursion is not recognized by JavaScript, hence for larger input too the error would remain the same which is “Range Error: Maximum call stack size exists” since JavaScript will treat Tail Recursion in a similar manner as it treats normal recursion which is thus executed under Call Stack.

Trampoline function:

This trampoline function is actually the helper function that is used to implement Tail Recursion. In this, we convert all the nested function calls into the sequential number of function calls which thus helps us to prevent a stack overflow condition. 

The trampoline function basically wraps the recursive function into the loop and thus further it calls that recursive function piece by piece until no longer recursive calls remain present.

Trampoline functions are though the best example to show Functional Programming in JavaScript. This function will provide us the result for much larger values which in previously mentioned techniques hasn’t been achieved (neither in regular recursion nor in tail recursion).

Example: Following code snippet will make things more clear about the working of this trampoline function:

Javascript

// Trampoline function Implementation
const trampoline_function = (func) => (...rest_arguments) => {
  let result = func(...rest_arguments);
  while (typeof result === 'function') {
    result = result();
  }
  return result;
};

// Sum Calculation Program Implementation
const sumCalculation = (num, sum = 0) => {
  return num === 0 ? sum : () => sumCalculation(num - 1, sum + num);
};

// Wrapping function in Trampoline function
// which is implemented above
const sumCalculate = trampoline_function(sumCalculation);
console.log(sumCalculate(5));
console.log(sumCalculate(1000000));

Output:

15
500000500000