JavaScript Coding Challenge #3

Today we’re going to take a look at the second Project Euler problem:

Even Fibonacci numbers

Each new term in the Fibonacci sequence is generated by adding the previous two terms. By starting with 1 and 2, the first 10 terms will be:

1, 2, 3, 5, 8, 13, 21, 34, 55, 89…

By considering the terms in the Fibonacci sequence whose values do not exceed four million, find the sum of the even-valued terms.

Note: You might see somewhere else that the Fibonacci series will start with 1, 1 instead of 1, 2 as we have now. But for simplicity sake we’ll stick to what they gave us…

JavaScript solution

First we’re going to write a function fibSeries that will return all the fibonacci numbers that are less than 4,000,000. For that we’ll initialize two variables var a = 1 and var b = 2; these are the initial two fibonacci numbers. Also let’s add a variable that will hold the next fibonacci number (a + b):

function fibSeries() {
    var a = 1;
    var b = 2;
    var next = a + b;
}

Good! Now let’s create a while loop which will run as long as the new fibonacci number, that we called next, will be less than 4,000,000. Also let’s add the fibonacciArray that will be returned from the function at the end:

function fibSeries() {
    var a = 1;
    var b = 2;
    var next = a + b;
    var fibonacciArray = [];
    while(next < 4000000){
    }
    return fibonacciArray;
}

Perfect! Now we’ll have 4 steps in the while loop:

1. if next is even (the remainder of the division by 2 is equal to 0), push it into the fibonacciArray;
2. set a (element 1) to become b(element 2);
3. set b to become next(the new element);
4. calculate the new value of next;

function fibSeries() {
    var a = 1;
    var b = 2;
    var next = a + b;
    var fibonacciArray = [];
    while(next < 4000000){
        if(next % 2 === 0){
            fibonacciArray.push(next);
        }
        a = b;
        b = next;
        next = a + b;
    }
    return fibonacciArray;
}

Great! The fibSeries function is finished. All that’s left to do now is to sum all the numbers that are in the array. For that I’m going to create another function that will return the correct answer for our problem, in this case a sum:

function sumFibonacci(){
    var sum = 0;
    // code logic for adding all the numbers of the array
    return sum;
}
function fibSeries() {
    var a = 1;
    var b = 2;
    var next = a + b;
    var fibonacciArray = [2];
    while(next < 4000000){
        if(next % 2 === 0){
            fibonacciArray.push(next);
        }
        a = b;
        b = next;
        next = a + b;
    }
    return fibonacciArray;
}

I’m going to show you 2 methods for doing the sum:

First method ~ the old ‘for loop’

For this we’ll need 3 easy steps:

1. store the array returned from the fibSeries function;
2. loop through all the numbers of the array and add them to the sum;
3. return the sum;

function sumFibonacci(){
    var sum = 0;
    var fibonacciArray = fibSeries();
    for(var i=0, n=fibonacciArray.length; i<n; i++){
        sum += fibonacciArray[i];
    }
    return sum;
}
function fibSeries() {
    var a = 1;
    var b = 2;
    var next = a + b;
    var fibonacciArray = [2];
    while(next < 4000000){
        if(next % 2 === 0){
            fibonacciArray.push(next);
        }
        a = b;
        b = next;
        next = a + b;
    }
    return fibonacciArray;
}

Second method ~ using reduce

We can take advantage of a very neat array helper called: reduce. You can find out more about reduce here.

Basically reduce has 2 parameters:

1. a callback function, which will have 2 parameters: (1) the accumulator (total in our case) and (2) the current item in the array;
2. a default value for the accumulator, in our case 0;

The callback will return a new value that will be assigned to total for the next iteration.

To better understand it let’s see how it written in code:

function sumFibonacci(){
    var sum = 0;
    var fibonacciArray = fibSeries();
    sum = fibonacciArray.reduce(function(total, item) {
        return total += item;
    }, 0);
    return sum;
}
function fibSeries() {
    var a = 1;
    var b = 2;
    var next = a + b;
    var fibonacciArray = [2];
    while(next < 4000000){
        if(next % 2 === 0){
            fibonacciArray.push(next);
        }
        a = b;
        b = next;
        next = a + b;
    }
    return fibonacciArray;
}

We can simplify even more the sumFibonacci function:

function sumFibonacci(){
    return fibSeries().reduce(function(total, item) {
        return total += item;
    }, 0);
}
function fibSeries() {
    var a = 1;
    var b = 2;
    var next = a + b;
    var fibonacciArray = [2];
    while(next < 4000000){
        if(next % 2 === 0){
            fibonacciArray.push(next);
        }
        a = b;
        b = next;
        next = a + b;
    }
    return fibonacciArray;
}

As you can see we removed both variables: sum and fibonacciArray, and directly returned the total sum. This is the power of JavaScript! :D

Conclusion

There are adjustments we can do to the code, but I’ll leave that to you! Write your own solution down below in the comments section. I’d love to see it.

This challenge implied to go up to 4,000,000; but we can change that number and the result will remain correct.

If you liked my post, I would sincerely appreciate a click on the Recommend button. 💚