The Code
How it Works
- fizzBuzz() is the main function of the application that encompasses all logic in the program
- First, the program gets user-entered values from the text inputs in the HTML document:
- Starting Value
- Ending Value
- FIZZ
- BUZZ
- The application will show the user an error alert if they try to enter any characters other than numbers, if starting value is a larger number than ending value, or if they do not enter any numbers at all.
- After getting the values from the text inputs, the program then parses the values into integers. FIZZBUZZ requires data to be integers in order to operate.
- The application then generates an array, incremented by 1, based on the starting value and ending value provided by the user.
- Once the array is generated, all numbers in the array are processed through a loop. This loop compares each number in the index to a set of conditions:
- If the number is divisible by the value entered for FIZZ and BUZZ, the number will be replaced with the word "FIZZBUZZ."
- If the number is divisible by the value entered for FIZZ but not divisible by the value for BUZZ, the number will be replaced with the word "FIZZ."
- If the number is divisible by the value entered for BUZZ, but not divisible by the value for FIZZ, the number will be replaced with the word "BUZZ."
- If the number is not divisible by the values for FIZZ or BUZZ, but is an even number, a default CSS style is added
- If the number is not divisible by the values for FIZZ or BUZZ, but is an odd number, an alternative default CSS style is added
- After all numbers are processed, the results are displayed to the user by using JavaScript to generate div elements with CSS and Bootstrap classes.