FizzBuzz challenge

Aan het eind van de introductie in web development van Tjerk heeft hij ons een programmeer challenge gegeven.

Maak in [taal naar keuze] het volgende,
1. Tel van 0 tot 100 en zeg het getal
2.Wanneer het getal deelbaar is door 3 zeg dan "Next"
3. Wanneer het getal deelbaar is door 5 zeg dan "Web"
4. Wanneer het getal deelbaar is door 3 en door 5 zeg dan "Next Web"

Deze periode ga ik verder met het leren van JavaScript dus hier wil ik deze challenge in proberen te maken.

Ik heb eerst opgezocht hoe je in JS van 0 tot 100 kan tellen, dit doe je met een for loop. In een for loop zet je een variable met een start waarde, dan de condition wanneer de loop actief mag zijn en als laatst de actie die word uitgevoerd. Om van 0 tot 100 te tellen en deze nummers te loggen heb ik daarom het volgende geschreven:

for (let i = 1; i < 101; i++) {

    console.log(i);

}

Nu moet ik voor elk cijfer deelbaar door 3 "Next" krijgen, Tjerk heeft als tip gegeven om hiervoor naar modulus te kijken. Modulus is een operator die twee cijfers door elkaar deelt en wat overblijft terug geeft. Ik kan dus checken of mijn i variable deelbaar is door 3 als ik hier een 0 voor terug krijg in een if statement.

if (i % 3 === 0) {

    console.log("Next");

}

In de vorige periode heb ik via Codecademy geleerd hoe ik een else if statement kan toepassen en dit heb ik hier ook voor gedaan om stap 2, 3 en 4 van de opdracht te maken. Deze heb ik vervolgens in de loop geplaatst zodat dit bij elk cijfer van 0 tot 100 wordt gedaan.

for (let i = 1; i < 101; i++) {

    console.log(i);

    if (i % 3 === 0) {

        console.log("Next");

    } else if (i % 5 === 0) {

        console.log("Web");

    } else if (i % 3 === 0  && i % 5 === 0) {

        console.log("Next Web");

    }

}

Dit werkte alleen niet, "Next Web" komt op deze manier nooit in de log. Met hulp van Richard ben ik er achter gekomen dat dit komt doordat op het moment dat iets door 3 en door 5 deelbaar is de statement al stopt bij de eerste if, omdat het deel baar is door 3 en dus geeft hij "Next". Ik moet hiervoor de grootste vraag bovenaan zetten. Ook moesten de nummers die deelbaar zijn door 3 en 5 ook niet meer in het log komen, hiervoor heb ik dit als laatste else geplaatst zodat de nummers alleen komen wanneer er geen van de woorden komen te staan.

for (let i = 1; i < 101; i++) {

    if (i % 3 === 0 && i % 5 === 0) {

        console.log("Next Web");

    } else if (i % 3 === 0) {

        console.log("Next");

    } else if (i % 5 === 0) {

        console.log("Web");

    } else {

        console.log(i);

    }

}

Achteraf bleek dit een bekende challenge te zijn die veel gebruikt wordt bij sollicitaties van programmeurs, de FizzBuzz challenge. Er blijken veel meer verschillende manier te zijn waarop je hetzelfde resultaat kan krijgen. Aangezien ik net begonnen ben met JavaScript was het best pittig maar wel een leuke uitdaging.