Keff

Posted on Jul 17, 2020 • Updated on Aug 20, 2020

[Challenge] 🐝 FizzBuzz without if/else

#challenge #javascript

This challenge is intended for Javascript, but you can complete it with any language you like and can.

Most of us will know the FizzBuzz game/exercise and probably have done it many times. It should be a simple and straightforward exercise for most developers...

BUT can you do it without using if/else statements?

Challenge Description

Write a program that outputs the string representation of numbers from 1 to N.

But for multiples of 3, it should output "Fizz" instead of the number and for the multiples of 5 output "Buzz". For numbers which are multiples of both 3 and 5, you should output "FizzBuzz".

Curveball: You must not use if/else statements, and ideally, no ternary operator.

Example:

const n = 15;

/* 
Return:
  [
    "1",
    "2",
    "Fizz",
    "4",
    "Buzz",
    "Fizz",
    "7",
    "8",
    "Fizz",
    "Buzz",
    "11",
    "Fizz",
    "13",
    "14",
    "FizzBuzz"
  ]
*/

I will comment my solution in a couple of days.

💪 Best of luck! 💪

Credits:
Cover Image from https://codenewbiesite.wordpress.com/2017/01/29/fizz-buzz/

Oldest comments (93)

Tanguy Andreani • Jul 17 '20

I did that in scheme r5rs:

#lang r5rs

(define (fizzbuzz n acc)
  (define (compute n)
    (let* ((fizz (and (zero? (modulo n 3))
                      "fizz"))
           (buzz (and (zero? (modulo n 5))
                      "buzz"))
           (both (and fizz
                      buzz
                      "fizzbuzz")))
      (or both fizz buzz n)))
  (or (and (zero? n) acc)
      (fizzbuzz (- n 1)
                (cons (compute n)
                      acc))))

(display (fizzbuzz 15 '()))
(newline)
; => (1 2 fizz 4 buzz fizz 7 8 fizz buzz 11 fizz 13 14 fizzbuzz)

As promised, no ifs.

Keff • Jul 17 '20 • Edited

Thanks for sharing Tanguy!

Cool stuff! Haven't heard about r5rs, looks complicated, but cool :P

Tanguy Andreani • Jul 17 '20 • Edited

Oh it isn’t that hard, it might seem complicated because of all the parenthesis and strange keywords like cons, but it’s actually just a matter of getting used to it. It’s a fun language to learn recursion for example.

It becomes a lot simpler when you learn the patterns for building recursive functions, at one point, you don’t even look at the whole function because you just think of the parts.

I started by making a function that looks like that:

#lang r5rs

(define (fizzbuzz n acc)
  (define (compute n)
    n)
  (if (zero? n)
      acc
      (fizzbuzz (- n 1)
                (cons (compute n)
                      acc))))

(display (fizzbuzz 15 '()))
(newline)
; => (1 2 3 4 5 6 7 8 9 10 11 12 13 14 15)

This function just returns the list of numbers from 1 to 15, that's what it does because the compute function just returns whatever is n. Then I simply filled compute with my conditions.

define is used to define variables and functions,
cons is used to build a list from a head and a queue (that's not hard to understand but it definetely requires some practice and research,
let* allows to define local variables

Keff • Jul 17 '20 • Edited

What a legend! I wasn't expecting an explanation, but it's highly appreciated!

Looks interesting, and after your explanation, it does not look as complicated, I might give it a try someday💪

And yeah, most languages seem a bit overwhelming at first.

Tanguy Andreani • Jul 17 '20

Thanks! Feel free to ping me for help if you try to get into it and feel stuck.

Keff • Jul 17 '20

Thank you! I will if I get into it :)

Javier Silva Ortiz • Jul 17 '20

I don't know this language, but the (and (zero? ... sounds like ternaries to me :)

Tanguy Andreani • Jul 17 '20 • Edited

It’s not a ternary, it’s just like doing && in other languages. Now you can emulate a ternary with it, I think that was the goal of the challenge. No ifs and no ternary.

Jesse Solomon • Jul 17 '20 • Edited

Thanks for the fun challenge!

I'm not sure if JavaScript's type conversion is considered cheating, but I thought it was cool and wanted to share!

const n = 15;

let output = new Array(n).fill(null);

output = output.map((_value, index) => {
    let offsetIndex = index + 1;

    return (["", "Fizz"][!(offsetIndex % 3) + 0] + ["", "Buzz"][!(offsetIndex % 5) + 0]) || offsetIndex;
});

console.log(output);

ogrotten • Jul 17 '20

why _value?

I understand that the 'convention' for _ is for private, but is there some other use for it here?

Or is it just habit 😂

SavagePixie • Jul 17 '20

It is also a convention for unused parameters.

Keff • Jul 17 '20

Thanks for sharing Jesse!! It's a really neat solution 🤘!
Also not cheating at all!

ogrotten • Jul 17 '20 • Edited

Hmm... As a bootcamp student, I'm trying to untangle this.

[!(offsetIndex % 3) + 0]
I see this checks the modulus, and inverts the result. Any non-zero int is truthy, and this expression makes it false . . . +0 to coerce the false to an int. That is enough that the entire thing evaluates falsy, which then results in outputting offsetIndex on the otherside of the or. I had to drop this in a node repl to follow it, but I eventually got it 😁

But what is the ["", "Fizz"][!(offsetIndex % 3) + 0] double-array looking thing there? I thought it was a 2d array at first, but that doesn't seem right for a number of reasons.

Corey Alexander • Jul 18 '20

I'm pretty sure the first pair of square brackets creates an array, and the second one indexes into that array. So I think they are array indexing into the first array with either 0 or 1 to pick the empty string or "Fizz" depending on the offsetIndex!

Hope that helps!

Keff • Jul 18 '20

yup, it defines the array first const array = ["", "Fizz"] and then access the index array[!(offsetIndex % 3) + 0]. The expression will resolve either to true+0 -> 1 or false+0 -> 0

ogrotten • Jul 18 '20

holy shit. that's cool.

I THOUGHT it might have been something like that, but I was thinking about it wrongly . . . I wasn't thinking of it as the array followed by the index, I was thinking of it as a variable. So ["an", "array"] was the name of the array, and then it had it's own index. Not very practical.

But the actual use is quite cool and makes plenty sense.

Thanks!

Andrew Luchuk • Jul 17 '20

Thanks for the fun challenge! My solution uses bitwise operators and objects to get the answer:

function fizzbuzz(n) {
    for (let i = 1; i < n+1; i++) {
        outputs = {
            [i]: i,
            [i+1]: 'fizz',
            [i+2]: 'buzz',
            [i+3]: 'fizzbuzz'
        }
        let fizz = +(i % 3 == 0);
        let buzz = +(i % 5 == 0);
        buzz <<= 1;
        let fizzbuzz = fizz ^ buzz;
        console.log(outputs[i+fizzbuzz]);
    }
}

Keff • Jul 17 '20

Neat!

Russ Edwards • Jul 17 '20

Here's a solution to the challenge in JavaScript...

function fizzBuzz (n) {
    let i = 1
    let fbline = []
    let output = []
    let count = 0
    while (i <= n) {
        fbline = [i, i, i, "Fizz", i, "Buzz", "Fizz", i, i, "Fizz", "Buzz", i, "Fizz", i, i, "FizzBuzz"]
        output.push("" + fbline[(i+count) % 16])
        i++
        count = Math.floor(i / 16)
    }
    console.log(output)
}
fizzBuzz(90)

Here's a repl.it where you can run this.

agtoever • Jul 17 '20

A solution in Python. Feels silly though...

def fizzbuzz(n):
    offset = 0
    while n > 0:
        cycle = list(range(offset, 15 + offset))
        for i in range(3, 15, 3):
            cycle[i] = 'Fizz'
        for i in range(5, 15, 5):
            cycle[i] = 'Buzz'
        cycle.append('FizzBuzz')
        cycle.remove(offset)
        print('\n'.join(map(str, cycle[:min(15, n)])))
        offset += 15
        n -= 15


fizzbuzz(22)

Keff • Jul 17 '20

Wait until you see mine 😂

agtoever • Jul 17 '20 • Edited

Holy sh*t, my other solution was really ugly! :-o
Here is a (much) better one (also in Python3):

def fizzbuzz(n):
    for i in range(1, n + 1):
        print([f'{i}', f'Fizz', f'Buzz', f'FizzBuzz'][(i % 3 == 0) + 2 * (i % 5 == 0)])

fizzbuzz(22)

This works using the property that True in Python has numerical value 1 and using f-strings in an array. The proper element in the array is chosen based on the mentioned property, checking for divisibility with 3 and 5.

Stephanie Handsteiner • Jul 17 '20 • Edited

Easy, just do it in CSS.

ol {
    list-style-type: inside;
}

li:nth-child(3n), li:nth-child(5n) {
    list-style-type: none;
}

li:nth-child(3n):before {
    content: 'Fizz';
}

li:nth-child(5n):after {
    content: 'Buzz';
}

Needs some Markup to display obviously.

Ben Halpern • Jul 17 '20

Ha!

Keff • Jul 17 '20

Magnificent! I knew there were going to be really neat solutions!!

Thanks for sharing your solution 💪

Steven vanZyl • Jul 17 '20

The cleanest and best FizzBuzz implementation I know of doesn't use any if statements at all. Actually it doesn't use any control flow at all in most languages.
The approach is fully described here: philcrissman.net/posts/eulers-fizz...

On my Repl.it I also have this same approach implemented in several other languages:
repl.it/@rushsteve1/

Keff • Jul 17 '20

I did not know about this, thanks for sharing. I will remember this!

Corey Alexander • Jul 18 '20

This was great! Love it when there is a simple probable mathematic solution to these kinds of things!

Keff • Jul 18 '20

Me too, so clean! I love maths but I'm crap at it myself xD

Heiker • Jul 17 '20 • Edited

You can still have flow control with functions.

const troo = (iff, elz) => iff;
const falz = (iff, elz) => elz;
const choose = (value) => [falz, troo][Number(Boolean(value))];

const is_fizz = (n) => choose(n % 3 === 0);
const is_buzz = (n) => choose(n % 5 === 0);

const fizzbuzz = (n) =>
  is_fizz(n) (
    () => is_buzz (n) ("FizzBuzz", "Fizz"),
    () => is_buzz (n) ("Buzz", n),
  )
    .call();

const range = (end) =>
  new Array(end).fill(null).map((val, index) => index + 1);

range(15).map(fizzbuzz).join(", ");

Keff • Jul 17 '20

I liked this approach! Thanks for sharing!

John D'Alessandro • Jul 17 '20

I do feel like this was kinda cheap...

using System;
using System.Collections.Generic;
using System.Linq;

public class Program
{
  public static void Main()
  {
    foreach(var s in FizzBuzz().Take(15))
      Console.WriteLine(s);
  }

  public static IEnumerable<string> FizzBuzz()
  {
    for(int i = 1; true; i++)
    {
      for(;i%3!=0 && i%5!=0;)
      {
        yield return i.ToString();
        break;
      }
      for(;i%3==0;)
      {
        for(;i%5==0;)
        {
          yield return "FizzBuzz";
          break;
        }
        yield return "Fizz";
        break;
      }
      for(;i%5==0;)
      {
        yield return "Buzz";
        break;
      }
    }
  }
}

Nočnica Mellifera • Jul 17 '20

I like it!

Keff • Jul 17 '20

Nice stuff! Cool use of a generator. And yeah kinda cheap but cool nonetheless, thanks for sharing!

Benjamin Trent • Jul 17 '20 • Edited

Clojure example.

I quite like Andrew's bit shift array example. Only think that its better to have a nil zeroth value so you get circuit breaking for free.

;; Array for grabbing appropriate string, if exists
(def fizzes [nil "Fizz" "Buzz" "FizzBuzz"])

;; boolean to integer conversion
(defn b-to-i [b]
  (bit-and 1 (bit-shift-right (Boolean/hashCode b) 1)))

(defn fizzit [n]
  (let [fizzed (b-to-i (= 0 (mod n 3)))                     ;1 if true
        buzzed (bit-shift-left (b-to-i (= 0 (mod n 5))) 1)  ;2 if true
        both (+ fizzed buzzed)]                             ;3 if both are true
    (or (get fizzes both) (str n)))
  )

(defn fizzbuzz [n]
  (map fizzit (range 1 (inc n))))

repl.it link

Keff • Jul 17 '20

Cool solution! I thought to do something similar at first, but ended up doing some weird stuff!

mintyPT • Jul 17 '20

Here is some python for you :)

print([
  (not (i % 3) and not (i % 5) and "FizzBuzz") or
  (not (i % 3) and "Fizz") or
  (not (i % 5) and "Buzz") or
  i
  for i in range(1,16)])

Valentin Radu • Jul 17 '20

Here's the simplest I can think of without any statements. 🙃

function run(n, i=1, j=1, k=1, acc=[]) {
  !j && k && acc.push('fizz')
  !k && j && acc.push('buzz')
  !k && !j && acc.push('fizzbuzz')
  k && j && acc.push(i)

    n - 1 && run(n - 1, i + 1, (j + 1) % 3, (k + 1) % 5, acc)
  return acc
}

console.log(run(30))

Keff • Jul 18 '20

Nice, recursion for the win 💪

Keff • Jul 18 '20

Thanks for sharing!

Nicole & (she/her) • Jul 18 '20

fun challenge! this is the simplest thing I can think of at the moment

const fizzBuzz = (num) => {
    return [...Array(num+1).keys()].slice(1).map(n => {
        const fizzBuzz = n % 3 === 0 && n % 5 === 0 && 'FizzBuzz'
        const fizz = n % 3 === 0 && 'Fizz'
        const buzz = n % 5 === 0 && 'Buzz'
        return fizzBuzz || fizz || buzz || n.toString()
    })
}

console.log(fizzBuzz(15))

View full discussion (102 comments)

DEV Community

[Challenge] 🐝 FizzBuzz without if/else

Challenge Description

Oldest comments (93)

Read next

I fine-tuned my model on a new programming language. You can do it too! 🚀

Glam Up My Markup: Camp Activities

News admin dashboard

Pass by value vs pass by reference in JavaScript