7 days of WordPress plugins, themes & templates - for free!* Unlimited asset downloads! Start 7-Day Free Trial
FREELessons: 30Length: 4.8 hours

Next lesson playing in 5 seconds

Cancel
  • Overview
  • Transcript

5.5 Demo: FizzBuzz

In this demo application, we will be solving a problem that is often posed in basic development job interviews. It’s known as the "FizzBuzz problem". The basic idea is that you need to go through each number in a given range and for each one output "Fizz" if it's divisible by 3 or "Buzz" if it's divisible by 5. If the number is divisible by both 3 and 5, output "FizzBuzz”, and if none of the conditions are true, just output the number. Let's have a go!

5.5 Demo: FizzBuzz

Now it's time to put our knowledge of functions to good use. And so, we're going to combine the concept of functions with some other things that we've been learning along the way to solve a particular problem. Now, this particular problem resonates with me because this has been part of an interview process. That I have gone through in order to get a job and it was kind of a cool problem that I had actually never heard of at the time. But was able to work my way through it and then get another interview and then ultimately wind up getting the job. So this is a very common problem and you're going to see and if you've never heard of it. You can deafness search around the Internet and you'll find some information about it because it's fairly, the basic idea here is this we have to solve the FizzBuzz problem. It's quite simple in nature and there's hundreds of different ways you can solve this. So ultimately the solution is gonna be up to you. But the way that this works is you're going to be given a range. You're gonna be given a starting point integer and an ending point integer. And then at the end of the day all you want to do is you want to go through each one of those numbers and if the number that you're at is divisible by three, you wanna output fizz. If the number is divisible by five you wanna output buzz. If it's divisible by both three and five then you wanna output fizz buzz, and then if none of those conditions are true then you just want to output the number. So it's a fairly simple concept but like I said, there's many many different ways you can do this. So I'm going to go down a very simple path, but you can absolutely do whatever you would like, and if you would like, once again, I'm going to urge you to go ahead and pause the video. And then go ahead and come up with some solution. And then go ahead and start the video again and catch up, and see kind of where we end. Cuz the cool thing about any sort of software development is that ultimately if you get from point A to point B and you solve a problem, then there's really no right or wrong answer. Some might be more optimal than others but at the end of the day, it doesn't really matter. So let's go ahead and start to work through this. So like I said, if you want to go on pause a video do that now. And then come back and we can compare notes. Okay so what I'm going to do here is I'm going to start by creating a simple function. And we'll just call this fizz buzz. And the idea here as I mentioned is that we're going to provide two parameters. We're going to provide an input in an output. There's a couple different ways you can do this but ultimately I'm just going to make this fairly simple. I'm going to have this be two values here. I'm gonna have some external parameter names and some internal parameter names. So we'll just say we're going to have a starting int and then internally will call this start. And this is going to be an integer. And then we'll have an ending in which is going to be called End and that's going to be an edge or as well and I don't think we're going to output anything in this case. You could output the values that we come up with and the strings that we come up with and just call this function hundreds of times depending on how many inputs you get, but I think that might be a little bit overkill. So I'm just going to take in the beginning and ending point and handle everything internally, all the printing and whatever have you. So what we're going to do now is we're going to want to loop through all the different values that we have starting at start an ending at end. So you could use pretty much any sort of looping construct that you want. But I am going to use just a simple for in. So we'll go ahead and say for and then I'll just give this a variable name or just say i in. And then we want to give this a range. We want to start at start and we want to go up to end. And that should be good. So now for each of the values that are provided in we're going to have that stored in our variable i, now comes the interesting part. How do you solve this? This is what I'm talking about there's probably hundreds of different ways that you could solve this particular problem. And I'm going to try to use something a little bit more SWF maybe a little SWF 2.0, if you will. To solve this, just to kind of give you an example. So we're going to use a little bit of pattern matching, and what I'm gonna do is I'm going to actually create a tuple. So I'm going to say, let mods, and you'll see why I call it that in a second. And I'm gonna set that equal to a tuple, and it's gonna have two values in it. It's gonna have the modulus of three and the modulus a five. So let's go ahead and see what that will look like. So, I'll have i mod three and i mod five. So if you are unfamiliar with the modulus operator, the percent sign here that is simply going to say all right I want to divide whatever numbers is in i by 3, and then provide the remainder. So if this is a three so if it divides evenly the remainder will be zero, and that's ultimately what we're looking for. And if we get a remainder of something else then that means it was not evenly divisible by that particular number, and in this case that's 3 and 5. So now I have this in mods, in my mods variable, and I'm gonna go ahead and do a switch statement. I'm gonna switch on mods, like this, okay. So now I'm gonna have a couple different case statements that I'm going to need to go through to see what is divisible by what. And you're gonna see why I did it this way pretty quickly. So what I want to do now is I want to check for the different scenarios. Is it divisible by three? Is it divisible by five? Is it divisible divisible by both? And then ultimately do none of those things match anything? So what I'm going to start with, and this might be something that you think about or that I originally thought about way back when, a starting point. But we're going to see that it's going to backfire a little bit. So I'm going to do a case statement here, and I want to check if this is divisible by three and I want to do pattern matching within a tuple. So what I'm curious about at this point is is the number divisible by three? So that would mean the first value in my tuple would be zero, so that's what I'm interested in. And because I'm checking for just divisible by three, then the five at this point, I don't really care about. So let's just go ahead and use the wild card here to say, I don't care what that second number is, because I'm only interested in the first one. So then let's go ahead and come down and we will then, at this point we will go ahead and print out fize, because at this point. The number is going to be divisible by three represented by this case statement. So let's go ahead and create another case statement. So we'll say case. And in this point we want to do Are you divisible by 5? So in this case, I don't care about the 3. And I only care about the 5, which will be represented by this case statement. And in this case, we will just go ahead and print out buzz. All right, so that seems fairly straightforward. Then we'll come down and we'll create another case statement. And in this case, I wanna know if it's divisible by both. So let's go ahead and do this case, which would be both 0, so this would mean both of those values or the value that's provided in the I right now is divisible by both three and five. So we'll go ahead and print that out and remember this is going to be fizz buzz. And then at the end we are going to run into the scenario where none of these cases are true, so we'll just provide a default here and we'll go ahead and print out the number here. We'll just print out some string interpolation here of i, like that. So let's go ahead and save this. So that seems like a fairly reasonable implementation. So let's come down here and we're just going to call fizzbuzz, and we need to provide two integers a starting int and an ending int. So let's just keep it simple for now. And let's go from one up to let's say ten, I think that'll be a good starting point. So let's save that and we'll run it. And once we get our result here we'll see that. it seems like it might have worked okay. So we have one is not divisible by three or five neither is two but then three is obviously divisible by three so that gives us Fizz. For is not five obviously is divisible by five we get buzz six is divisible by three seven eight neither nine is divisible by three and ten is divisible by five. So that seems to work out okay, but let's go ahead and up this a little bit so we can say from 10 to 15, because 15 is going to be the first number that we get to that should be divisible by both. So we should see fizz buzz for 15. So let's go ahead and run this application. And we're going to see pretty quickly here that we might not be getting what we think we wanted or that we intended to get. So we have 10 is the visible by five eleven is neither. Twelve is divisible by three thirteen fourteen and then fifteen should be divisible by both we would expect to see fizz buzz here but we're only getting physical. Why is that? Well because we are structuring our application this way, the structure here is absolutely fine there's nothing wrong with this whatsoever. The problem, though, is within our logic so what's happening here is, yes, the number 15 may be divisible by both cases here by three and five. But the problem is we come into our switch statement we hit our first case and this is going to be true because 15 is divisible by 3, we hit that first case statement and we print out fizz, and then we jump out and we come to the next value of i. We never get a chance to get down to this third case here, so when you're creating applications like this and you're going through your logic, you wanna make sure that you use the most specific check first, because if there are checks that kind of overlap each other a little bit like these do, so if I were to actually put this case first, it would have output buzz because this would have been a true statement. So what I should do here is I should actually cut this case. Bring it up here, and make that be the first check. So, in that case, I could check to see if it's divisible by both three and five, and then output this. And then handle the lesser of the specific versions here. And then go ahead and print out what happens here. So let's go ahead and save this, and we'll rerun our application. So now we should get buzz which is tense West a miserable by 5, 11, 12 is divisible by 3, 13 ,14 and then there's fizz buzz for 15 so now we're starting to get the output that we're looking for. So that's the basic process of creating a very simple function to serve a purpose to solve a problem here in this case it's the fizz buzz problem which like I said I kind of hold near and dear to my heart. So there's a basic demo application using some functions and some looping and some conditional statements and all sorts of cool things like that.

Back to the top