I am always struggling to visualize recursion because it isn't as straightforward as iterative approaches like while-loops and for-loops.
It is easy to lose track of what is going on in recursion because we most often work with abstract concepts like values (numbers) and variables (x & y).
How can a recursive approach to the Fibonacci series be visualized in a way that avoids abstraction and uses easy-to-imagine metaphors?
A popular introduction to recursion is through the Fibonacci Sequence.
The basic idea behind Fibonacci is this:
Every number after the first two is the sum of the previous two numbers.
1, 1, 2, 3, 5, 8, 13, 21... to Infinity
We can look at this question iteratively:
0 + 1 = 1 (1st)
1 + 1 = 2 (2nd)
1 + 2 = 3 (3rd)
2 + 3 = 5 (4th)
...
At iteration 0 & 1, the Fibonacci sequence has a value of 1. Each iteration after, we simply add the previous two values together returning 2... 3... 5... and so on.
Here is a JavaScript example of the iterative approach:
function fib(n) {
var prior = 1, // sum of previous sequence
priorprior = 1, // sum before previous
sum = 1; // sum of prior + priorprior
for (var i = 2; i <= n; i++) {
// get current fibonacci sequence value
sum = prior + priorprior;
priorprior = prior;
prior = sum;
}
return sum;
}
Recursion approaches this question from the end.
It assumes that we have the previous two values (2 & 3), and we only need to add them up to 5.
2 + 3 = 5 (4th)
To think about this, we can imagine that there is a tiny person who lives inside a box.
They have a simple job:
Just pass back 1 if the number is 1 or less.
Add the 2 previous numbers and pass their sum back out.
Inside this box, there are 2 more boxes: one for each of the previous Fibonacci sequence.
And inside each of those smaller boxes, there are more people doing the same simple jobs.
When we ask the person inside the first box to find a Fibonacci sequence, they will ask their boxes for the 2 previous Fibonacci sequence so they can sum them.
The people inside the smaller boxes will do the same.
This recursion will occur until when the Fibonacci sequence asked is for 1 or 0.
Those people only need to pass back 1.
Once numbers start being passed back up, people can start returning their sums, all the way back up to our original box.
Our first box will simply sum the 2 numbers they got back and hand us the answer.
Here is an illustration to help with this visualization:
An inefficient recursive JavaScript example:
function fib(n) {
if (n <= 1) {
return 1;
}
// return sum of the previous 2 numbers
return fib(n - 1) + fib(n - 2);
}
