FizzBuzz ... Moore

Account Required

This lesson is available if you sign in.
If you don't have an account, you can sign up for free.

FizzBuzz ... Moore

Sign in to access this content

You must sign in to access this content.
If you don't have an account you can sign up for free!

Problem

/**
* Print the integers from 1 to 100 (inclusive)
* But:
* - for multiples of three, print Fizz (instead of the number)
* - for multiples of five, print Buzz (instead of the number)
* - for multiples of both three and five, print FizzBuzz (instead of the number)
*/

Solution

/**
* Print the integers from 1 to 100 (inclusive)
* But:
* - for multiples of three, print Fizz (instead of the number)
* - for multiples of five, print Buzz (instead of the number)
* - for multiples of both three and five, print FizzBuzz (instead of the number)
*/
for (let index = 1; index <= 100; index++) {
let result = '';

if (index % 3 == 0) result += 'Fizz';
if (index % 5 == 0) result += 'Buzz';

if (result == '') result = index.toString();

console.log(result);
}

Transcript

00:00 I can't believe I'm doing this.

00:01 There are so many questions that are better than this one,

00:04 but if you are just starting out in your programming

00:06 journey, then there is a slight chance

00:08 that the interviewer just might

00:09 ask you this particular question.

00:11 So here we are and let's get started.

00:16 Here's the classic statement of the SBUs problem.

00:20 We have to print in images from one to 100, both inclusive

00:24 and for multiples of three.

00:25 Instead of printing the integer, we should print phase

00:28 for multiples of five print buzz,

00:30 and for multiples of both three

00:32 and five, we should print fbu.

00:35 Now, whenever you are given a programming challenge,

00:36 it's always a great idea to visualize it

00:39 with a few examples.

00:41 We want to print images like one, two,

00:44 but when there are multiples of three, for example three

00:47 and six, we want to print phase.

00:48 And for multiples of five, like five

00:50 and 10, we want to print buzz.

00:52 And for multiples of both three

00:54 and five, like 15, we want to print fizbos.

00:58 Now with that example out of the way,

00:59 let's start solving this problem step by step.

01:02 First, we have to print editors from one to 100,

01:05 and we can do that with a simple fall loop

01:07 that starts at one and terminates before 1 0 1

01:10 and increments by one in each iteration.

01:13 A naive approach would be to take the various conditions

01:16 and map them into simple if else blocks.

01:18 So if it is divisible by three, we print fiz.

01:21 If it is divisible by five, we print buzz.

01:24 And if it is divisible by both three and five, we print fbu.

01:27 Otherwise we log the integer.

01:29 However, this is not a correct solution

01:31 and we can see that when we execute the program

01:34 for the case when the number is divisible

01:36 by both three and five.

01:37 Instead of logging fizz buzz, it's logging fizz.

01:41 And this is a key mistake that a lot

01:43 of beginning developers make.

01:45 Fundamentally, the key realization

01:47 that is missing over here is

01:48 that the three conditions are not mutually exclusive.

01:52 If something is a multiple of both three

01:54 and five, it is essentially also a multiple of three

01:57 and also a multiple of five.

01:59 Now, once you make that realization,

02:01 it's pretty straightforward to come up with a solution.

02:04 We first check if it's a multiple of both three and five,

02:07 and in that case print FPAs

02:08 and then jump to the more loose cases of just three

02:11 and five di visibility.

02:13 And of course, this works as expected logging fbu for 15

02:17 and phase and buzz for three and five.

02:19 Now there is a general programming pattern over here,

02:22 and that is that when you have an overlap of conditionals,

02:25 always do the specific case first

02:27 and then handle the loose cases later.

02:30 Now, this is definitely a correct solution and

02:32 whenever given a choice, a correct solution is better than

02:35 no solution, but this is not the ideal solution.

02:37 So let's jump back to the code

02:38 and discuss how you can improve it further.

02:41 Now, there are a few things

02:42 that are not ideal about this code.

02:44 First off, there is duplication of the checks

02:47 with person three and person five going on over here,

02:50 and we could fix that by storing them

02:51 in temporary variables.

02:53 But a bigger realization here is that we are using a lot

02:56 of repeated console log statements.

02:58 If we take a closer look at the problem statement, note

03:01 that there is always a print happening

03:02 in all the conditions.

03:04 Once you make that connection, even a bigger realization is

03:08 that three is always mapping through the output.

03:10 Phase five is always mapping to the output plus.

03:14 So let's take a look at how we can take

03:16 advantage of this fact.

03:17 With code. First, we always have to log some string,

03:20 so let's create a variable to store that result

03:23 and remove the duplication of console log

03:25 to a single console log of the result.

03:27 Next, we simply amend result,

03:29 and if the index is divisible by three, we amend phase.

03:33 And if it is divisible by five, we amend buzz.

03:36 And this takes care of all the three main conditions.

03:39 Three gets mapped to fizz, five gets mapped to buzz,

03:43 and three combined with five gets mapped to fizz buzz.

03:46 And now for the outlier condition,

03:48 when it is not too visible by three

03:50 or five, we always want to print the incoming index

03:53 and we can do that with a simple assignment.

03:56 And of course it works as expected,

03:58 but this time the program is much simpler

04:00 because it is not a blind interpretation

04:02 of the problem statement,

04:04 but instead uses some intuitive facts about the

04:06 inputs and the outputs.

04:08 Now as a bonus, bonus point, one thing

04:10 that is great about this particular implementation is

04:13 that it is easily expendable to other multiple checks.

04:16 For example, for multiples of seven, if you wanted

04:19 to print more, we can add that quite easily.