Dr Melchisedec Bankole (Technical Writing)

Dr Melchisedec Bankole

1,000 JOB INTERVIEW TUTORIALS (Beta)

Click here to reveal the JavaScript interview challenge

1,000 Interview Questions Challenge To Annex Your Coding Super-Power (1)

Write a program that prints the numbers from 1 to 100. But for multiples of three print “Fizz” instead of the number and for the multiples of five print “Buzz”. For numbers which are multiples of both three and five print “FizzBuzz.”

JavaScript Solution:

FizzBuzz is a very popular programming challenge where you need to print numbers from 1 to 100, but for multiples of 3, print "Fizz" instead of the number, and for the multiples of 5, print "Buzz." For numbers that are multiples of both 3 and 5, print "FizzBuzz".

Here are 7 different ways to solve the FizzBuzz challenge in JavaScript:

For Loop/if-else:


for (let i = 1; i <= 100; 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);
    }
}

Ternary Operators:


for (let i = 1; i <= 100; i++) {
    console.log(
        i % 3 === 0 && i % 5 === 0 ? "FizzBuzz" :
        i % 3 === 0 ? "Fizz" :
        i % 5 === 0 ? "Buzz" :
        i
    );
}

Switch statement:


for (let i = 1; i <= 100; i++) {
    switch (true) {
        case i % 3 === 0 && i % 5 === 0:
            console.log("FizzBuzz");
            break;
        case i % 3 === 0:
            console.log("Fizz");
            break;
        case i % 5 === 0:
            console.log("Buzz");
            break;
        default:
            console.log(i);
    }
}

Array mapping:


for (let i = 1; i <= 100; i++) {
    const output = [i % 3 === 0 ? "Fizz" : "", i % 5 === 0 ? "Buzz" : ""].join('');
    console.log(output || i);
}

Function with if-else:


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);
        }
    }
}
fizzBuzz(100);

Array-based approach:


const result = Array.from({ length: 100 }, (_, index) => {
    const num = index + 1;
    return (num % 3 === 0 ? "Fizz" : "") + (num % 5 === 0 ? "Buzz" : "") || num;
});
console.log(result.join('\n'));

Recursive solution:


function fizzBuzzRecursive(n) {
    if (n > 0) {
        fizzBuzzRecursive(n - 1);
        const output = (n % 3 === 0 ? "Fizz" : "") + (n % 5 === 0 ? "Buzz" : "") || n;
        console.log(output);
    }
}
fizzBuzzRecursive(100);

Choose the method that best fits the requirements and coding style of your project.

Noteworthy: While FizzBuzz might seem elementary, it offers a springboard for exploring more complex programming concepts:

Alternative Approaches: experienced developers may explore various loop structures (such as while loops) or create modular functions as part of their problem-solving strategy.
Language-Specific Details: The way FizzBuzz is implemented can differ slightly depending on the programming language, showcasing the distinct syntax and features of each.
Testing and Debugging: FizzBuzz remains a valuable exercise for honing skills in testing and debugging, crucial aspects of real-world coding projects.

The FizzBuzz challenge retains its significant role in introductory programming evaluations and learning activities.

JavaScript Most Popular Job Interview Challenge Game: Write a program that prints the numbers from 1 to 100. But for multiples of three print “Fizz” instead of the number and for the multiples of five print “Buzz”. For numbers which are multiples of both three and five print “FizzBuzz”. Click here to reveal the 7 different ways to solve the FizzBuzz challenge in JavaScript

Time Left: 420 seconds