Mastering Conditional Statements, Loops, and FizzBuzz in JavaScript
Tags: webdev, javascript, programming, beginners
Published: 2023-12-14 14:23:56

## Table of Contents 

1. Introduction
2.0  Understanding Conditional Statements

- 2.1. Basic Conditional Statement

- 2.2. Nested Conditional Statements

3.0  FizzBuzz: A Fun Programming Exercise

- 3.1. The FizzBuzz Function

- 3.2. Using For Loop for FizzBuzz

- 3.3. Leveraging While Loop for FizzBuzz

4.0  Exploring For Loops

- 4.1. Basic For Loop Example

- 4.2. Applying For Loop to FizzBuzz

5.0  Unraveling While Loops

- 5.1. Basic While Loop Example

- 5.2. Adapting While Loop for FizzBuzz
6.0  Conclusion


## 1. Introduction
JavaScript is a versatile programming language with powerful features, and understanding conditional statements and loops is essential for effective programming. In this article, we'll dive into the basics of conditional statements and explore how to use them in practical examples. Additionally, we'll unravel the popular FizzBuzz problem using different loop structures.

## 2. Understanding Conditional Statements
Conditional statements are crucial for decision-making in programming. The else-if statement allows you to chain multiple conditions, providing alternative code blocks to execute based on different scenarios. Let's break down the provided code example that evaluates your last score and provides feedback on your performance for a better understanding.

## 2.1 Basic Conditional Statement

```
var score = prompt("enter your last score");

if (score > 50 && score <= 80) {
    alert("well above average");
} else if (score > 80 && score <= 90) {
    alert("Excellent performance");
} else if (score > 100) {
    alert("You are a genius");
} else {
    alert("You need to work harder");
}

```
**Interpretation** 

- If the score is between 50 and 80, the alert will display "Well above average."

- If the score is between 80 and 90, the alert will display "Excellent performance."

- If the score is above 100, the alert will praise with "You are a genius."

- If none of the above conditions are met, the default is "You need to work harder."

## 2.2 Nested Conditional Statements
Nested conditional statements allow for more complex decision-making. In the FizzBuzz examples, you'll see nested conditions based on divisibility.

## 3 FizzBuzz: A Fun Programming Exercise
FizzBuzz is a classic programming problem that involves printing numbers from 1 to 100. For multiples of 3, print "Fizz"; for multiples of 5, print "Buzz"; and for numbers divisible by both 3 and 5, print "FizzBuzz."

## 3.1 The FizzBuzz Function

```
var output = []
var count = 1;

function fizzbuzz(){
    if(count % 3 ===0 && count % 5 === 0){
        output.push("fizzbuzz")
    }
    else if(count % 5 === 0){
        output.push("buzz")
    }
    else if(count % 3 === 0){
        output.push("fizz")
    }
    
    else{
        output.push(count);
    }
        count++
        console.log(output)
    
   
}
fizzbuzz()
```
In this code, the fizzbuzz function generates an output array based on the FizzBuzz logic. Numbers are pushed into the array unless they are divisible by 3, 5, or both, in which case "Fizz," "Buzz," or "FizzBuzz" is pushed, respectively.

## 3.2 Using For Loop for FizzBuzz

```
function fizzBuzz(){
    for(count =1; count<=100; count++){
        if(count % 3 ===0 && count % 5 === 0){
            output.push("fizzbuzz")
        }
        else if(count % 5 === 0){
            output.push("buzz")
        }
        else if(count % 3 === 0){
            output.push("fizz")
        }
        
        else{
            output.push(count);
        }
            
    }
    
        console.log(output)
}
fizzBuzz()
```
Utilizing a for loop, this code efficiently generates the FizzBuzz sequence and logs the result.

## 3.3  Leveraging While Loop for FizzBuzz

```
var output = []
function fizzBuzz(){
    while(count <= 100){
        if(count % 3 ===0 && count % 5 === 0){
            output.push("fizzbuzz")
        }
        else if(count % 5 === 0){
            output.push("buzz")
        }
        else if(count % 3 === 0){
            output.push("fizz")
        }
        
        else{
            output.push(count);
        }
            count++
    }
    
        console.log(output)
}
fizzBuzz()
```
Here, a while loop achieves the same FizzBuzz result through a different iteration approach.

## 4. Exploring For Loops
For loops are excellent for iterating over a sequence of numbers or elements. Let's explore a basic example and apply it to the FizzBuzz problem.

## 4.1 Basic For Loop Example 

```
for (y = 0; y < 5; y++) {
    console.log(y);
}

```
This simple for loop prints numbers from 0 to 4.

## 4.2 Applying For Loop to FizzBuzz
By integrating a for loop into FizzBuzz, we efficiently generate the sequence without explicitly incrementing the counter.

## 5.  Unraveling While Loops
While loops continue iterating until a specified condition is false. Let's examine a basic while loop and adapt it for FizzBuzz.

## 5.1 Basic While Loop Example

```
var x = 1;
while (x < 5) {
    console.log(x);
    x++;
}

```
 This while loop prints numbers from 1 to 4.

## 5.2 Adapting While Loop for FizzBuzz
The while loop seamlessly accommodates the FizzBuzz logic, providing an alternative approach to the problem as shown in 3.3.

## 6 Conclusion 
Mastering conditional statements and loops is fundamental to becoming proficient in JavaScript programming. Through practical examples like the FizzBuzz problem, you've gained insights into applying these concepts in real-world scenarios. Continue experimenting and honing your skills to become a more adept JavaScript developer. Happy Christmas!