JSFiddle - React, Tailwind, and code Playground

by Sahil Batla

HTML

<div id="output">
    Here.
</div>

JavaScript

/*
"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”."
*/

function FizzBuzz(attributes) {
    //instance variables
    this.limit = attributes.limit;
    this.resultElement = attributes.resultElement;
}

FizzBuzz.prototype.printSeries = function() {
    //Using array as string concatenation is heavy
    var output_array = [];
    for (var i = 1; i <= this.limit; i++) {
        var modulus_five = i % 5,
            modulus_three = i % 3;
        
        if (modulus_three == 0 && modulus_five == 0) {
            output_array.push('FizzBuzz');
        } else if (modulus_three == 0) {
            output_array.push('Fizz')
        } else if (modulus_five == 0) {
            output_array.push('Buzz')
        } else {
            output_array.push(i);
        }
    }
    this.resultElement.innerText = output_array.toString();
}

var attributes = {
    limit: 100,
    resultElement: document.getElementById('output')
}
var fizzBuzz = new FizzBuzz(attributes);

fizzBuzz.printSeries();