FizzBuzz in JavaScript (node.js), my first JavaScript program

Posted on

Problem

I had just decided to learn JavaScript, so I wrote this program. I am sure you know what FizzBuzz is so I wouldn’t describe it here.

Console output:

``````Welcome to Node.js v15.12.0.
> const special = [[15, 'FizzBuzz'], [5, 'Buzz'], [3, 'Fizz']];
undefined
>
> function fizzbuzz (number) {
...     for (let [n, label] of special) {
.....         if (number % n == 0) {
.......             return label;
.......         }
.....     }
...     return number;
... };
undefined
>
> for (let i=1; i<=100; i++) {
...     console.log(fizzbuzz(i))
... }
1
2
Fizz
4
Buzz
Fizz
7
8
Fizz
Buzz
11
Fizz
13
14
FizzBuzz
16
17
Fizz
19
Buzz
Fizz
22
23
Fizz
Buzz
26
Fizz
28
29
FizzBuzz
31
32
Fizz
34
Buzz
Fizz
37
38
Fizz
Buzz
41
Fizz
43
44
FizzBuzz
46
47
Fizz
49
Buzz
Fizz
52
53
Fizz
Buzz
56
Fizz
58
59
FizzBuzz
61
62
Fizz
64
Buzz
Fizz
67
68
Fizz
Buzz
71
Fizz
73
74
FizzBuzz
76
77
Fizz
79
Buzz
Fizz
82
83
Fizz
Buzz
86
Fizz
88
89
FizzBuzz
91
92
Fizz
94
Buzz
Fizz
97
98
Fizz
Buzz
undefined
>
``````

It is a word for word translation of this Python program I wrote:

``````special = {15: 'FizzBuzz', 5: 'Buzz', 3: 'Fizz'}

def fizzbuzz(number):
for n, label in special.items():
if not number % n:
return label
return number

for i in range(1, 101):
print(fizzbuzz(i))
``````

JavaScript Code

``````const special = [[15, 'FizzBuzz'], [5, 'Buzz'], [3, 'Fizz']];

function fizzbuzz (number) {
for (let [n, label] of special) {
if (number % n == 0) {
return label;
}
}
return number;
};

for (let i=1; i<=100; i++) {
console.log(fizzbuzz(i))
};
``````

I don’t know much about JavaScript but I am definitely no stranger to programming, I used functions, early returns, arrays and direct iteration in this tiny script I wrote in under 10 minutes.

I have tried to use an object but discovered that in JavaScript the order of the key-value pairs is not preserved.

So how can it be improved?

Solution

A short review;

• `special` is not an evocative name, maybe `divisors`?
• `special` is polluting the global namespace, and should be defined within the function
• `fizzbuzz` -> `fizzBuzz`?
• I like your approach of capturing the data parts into a data structure instead of hard-coded statements. I would have added a comment that `15` is in the first place because it takes priority on `3` and `5`
• I would have called `n` `divisor` instead, and then `number` could be `n`
• It annoys me greatly that this function returns both ‘numbers’ and ‘strings’, but not enough that I would fix this in the code, it’s JS after all

Mandatory rewrite;

``````function fizzBuzz (n) {
//Observe that 15 is divisible by 3 and 5, so check 15 first
const divisors = [[15, 'FizzBuzz'], [5, 'Buzz'], [3, 'Fizz']];
for (let [divisor, label] of divisors) {
if (n % divisor == 0) {
return label;
}
}
return n;
};

for (let i=1; i<=100; i++) {
console.log(fizzBuzz(i))
};``````

Wikipedia: Fizz buzz

Programming

Fizz buzz (often spelled FizzBuzz in this context) has been used as an interview screening device for computer programmers. Writing a program to output the first 100 FizzBuzz numbers is a relatively trivial problem requiring little more than a loop and conditional statements. However, its value in coding interviews is to analyze fundamental coding habits that may be indicative of overall coding ingenuity.

For example, did you notice that

15 = 3 * 5

and

FizzBuzz = Fizz + Buzz

Therefore,

``````function fizzbuzz (n) {
let word = "";
if (n % 3 === 0) {
word += "Fizz"
}
if (n % 5 === 0) {
word += "Buzz"
}
if (word.length === 0) {
word = n;
}
return word;
}

for (let i = 1; i <= 100; i++) {
console.log(fizzbuzz(i));
}
``````