Algorithm Practice: Fizzbuzz problem

The fizzbuzz problem was simply a fun problem to work through. There are clear steps to break down the problem. While I initially had a tendency to try and usually unsuccessfully solve an algorithm problem by jumping into code and not outlining and pseudocoding the problem, tackling fizzbuzz helped me break that habit. I now know to be more patient and break every problem down into smaller parts.

Problem
The problem asks that our function console log or print out every number from 1 to n. We have to print "fizz" instead of the number for every multiple of 3. For every multiple of 5, we have to print "buzz", instead of the number. For numbers that are multiples of BOTH 3 and 5, we have to print "fizzbuzz".

If we call the function fizzBuzz with an argument of 5, it will look something like this:

fizzBuzz(5);
1
2
fizz
4
buzz

Solution

We can use a for loop to iterate through every integer from one to n. Inside the loop, we'll do some work with each integer, which will be console logging it. In cases where the integer is a multiple of 3, 5, or both, we will console log "fizz", "buzz", and "fizzbuzz", respectively. In order for our loop to recognize whether the integer is a multiple of 3, 5, or both, we will utilize conditionals.

To determine if an integer is a multiple of a given number, we can use the modulo % operator. If the result of a modulo operation is 0, then the integer is a multiple of a given number. If the result of a modulo operation is greater than 0, in other words, if there is a remainder, then the integer is not a multiple of the given number.

We'll use the modulo operator in our conditional to determine if we console log a string instead of the integer itself.

We will write out the for loop. In most for loops, the counter i typically starts at 0, but this problem is different. It specifically asks that we print out from 1 to n, meaning we don't need to start our counter at 0. Since we are also printing out n itself, we want to make sure our loop goes until i <= n, inclusive of n.

function fizzBuzz(n) {
  for (let i = 1; i <= n; i++) {
}

Next, we'll write out the first conditional which checks if an integer is a multiple of both 3 and 5. We use the and symbol && to include two conditionals in the if statement.

function fizzBuzz(n) {
  for (let i = 1; i <= n; i++) {
    if (i % 3 === 0 && i % 5 === 0) {
      console.log('fizzbuzz');
    } 
}

Next is the conditional for multiples of only 3, followed by a conditional for multiples of only 5.

function fizzBuzz(n) {
  for (let i = 1; i <= n; i++) {
    if (i % 3 === 0 && i % 5 === 0) {
      console.log('fizzbuzz');
    } else if (i % 3 === 0) {
       console.log('fizz');
    }
}

function fizzBuzz(n) {
  for (let i = 1; i <= n; i++) {
    if (i % 3 === 0 && i % 5 === 0) {
      console.log('fizzbuzz');
    } else if (i % 3 === 0) {
       console.log('fizz');
    } else if (i % 5 === 0) {
       console.log('buzz');
    }
}

Lastly, on the default case, we will simply console log the integer itself. These are all the other numbers that are not multiple of either 3 or 5.

function fizzBuzz(n) {
  for (let i = 1; i <= n; i++) {
    if (i % 3 === 0 && i % 5 === 0) {
      console.log('fizzbuzz');
    } else if (i % 3 === 0) {
       console.log('fizz');
    } else if (i % 5 === 0) {
       console.log('buzz');
    } else {
       console.log(i);
    }
}

It was not until this problem that breaking down into smaller steps became very apparent to me. I hope this helps in your algorithm studies!

Resources

Stephen Grider's Algorithms and Data Structures Udemy Course

Interview Cake

Comments

[Nishchal Gautam]

don't ever use else,

const getText = i => {
    if (i % 3 === 0 && i % 5 === 0) {
        return 'fizzbuzz';
    }
    if (i % 3 === 0) {
        return 'fizz';
    }
    if (i % 5 === 0) {
       return 'buzz';
    }
    return i;
}

And call this from your iterating code, and print that out,

there's a concept of cognitive load, if you have else on your code, your brain needs to track what's going on, and it'll lead to a very nested sloppy code,

try getting rid of else, keep edgecase on if and happy path on a straight line, your code will be readable. (line of sight)

And don't do this:

[Oliver]

Well done on solving this problem.

I would be tempted to go a step further. I think the jobs of iterating over the range and logging the result are separate concerns. I would start by extracting the range iteration. Then I would consider handling the logging elsewhere so that the function returns a string.

That's not to detract from your work though. You've certainly solved the difficult part.