Ruby vs JavaScript Iteration

A Newbies Guide to Development

January 5, 2015

Entering into anything new can be overwhelming and intimidating. I should know, I have chosen to enter the field of web development and I'm attending Dev Bootcamp. Dev Bootcamp (DBC) is a development bootcamp geared at taking you from newbie to a world class beginner in 18 weeks. It is going to be one of the most challenging experiences of my life. This blog series is designed to be an introduction to the world of development for the novice developer by a novice developer. By the end of this series I hope that you have had an opportunity to grow as much as I have.

LET'S GET READY TO RUMBLE!

Okay, not really. Truthfully I'm just too tired and as I've seen over these past 7 weeks, either Ruby or JavaScript can kick my butt. This week I found out what is at the bottom of the rabbit hole. I also discovered that if you sit in a chair too long, you do leave an imprint of your butt. I spent far too long on my solo challenge. What started off as a complicatedly simple idea, quickly spiraled out of control (You can try my game, Blitzkrieg WAR, here). I couldn't leave it alone and I ended up turning in this weeks challenges late. You could say that I was stuck in an infinite loop. See what I did there?!?

Both Ruby and JavaScript have basic ways you can iterate. You can iterate over an Array or you can even iterate over a block of code. While some of the conventions between Ruby and JavaScript are the same, for and while loops, there are special ways to iterate and Ruby seems to have a few more tricks up it's sleeves compared to JavaScript. Most of my examples in JavaScript will be snippets of code I used in my game, again, I'm just too tired to try and think of anything else. My attempt will be to show the code in JavaScript and the same code in Ruby. This will be a winner takes all Battle Royale so, "LET'S GET READY TO RUMBLE!"

Let's be honest, I'm lazy. I will spend a very long time trying to figure out a way to avoid doing something. Sometimes this works out, other times, I waste more time and energy than just completing the task at hand. That being said, when I was creating my game I didn't want to manually have to create an Array of 52 cards! Let's face it, that would be incredibly boring and time consuming. But what could I do? How could I make my life easier? In this corner we have the JavaScript for loop! So what are we doing here? Well let's break it down. First we need a way to hold our newly created deck of cards, think of it as the box that holds a real deck of cards. That box is our empty Array cards. We also create an Array suits that has the value of our card's suits. Now for the actual loop. We need a way to keep track of where we are in the loop, so we create the variable i and we assign it = 2. Next we need to determine how many times we want to iterate, so we set it it to run while i < 15. Okay, so we have set up the loop and we know how many times we want to iterate through it, we're done! Well not quite, if we left it at that it would become an infinite loop because i = 2 and 2 will always be less than 15. We need a way to increase our variable i, so we then say i++, which is just a fancy way of writing i + 1 = i. Now here is a catch, do you think that i++ is the same as ++i? Well actually they are similar, in the fact that they increment the variable i each time we run the loop. But they differ as to when we make the increment. i++ is telling us to increment i after we run the loop, while ++i is telling us to increment i and then run the loop. So be careful how you create the incremental statement.

All right, so we have set-up our for loop and it evaluates to true so we now jump inside the brackets and get to the meat of our… What?!? Another for loop? Yep, you can create a loop within a loop. Alright, lets break this loop down! Again we create a variable to keep track of where we are in the loop. We've already used i so this time, we set the variable j = 0. Wait, 0 last time we set it to 2! Well it is because we are using the variable for two purposes. Firstly, we are using it to help us where we are in the loop and we are using it to evaluate whether or not we will continue to run our loop, but we are also using it's value. I know that the suspense is killing you, but let's get through the creation of this for loop statement first. Alright, we need to determine how long to run this loop so this time we set it to j < suits.length. This time we will run through the loop as long as j is less than the length of our suits Array. Next we need to make sure that we increment the value of j so we say j++. Remember, we want to run the loop first and then increment j.

Now we jump into the heart of our loops and we start to create our deck of cards! Here we are taking the value of i, which at this point is 2 and adding an underscore and the value of suits[j]. Now here is why we set the values of our variables to what we did. i represents the value of our card, in this case 2. j represents the index of our suits Array, in this case 0 or the value of our first element 'C'. So the reason we didn't set i = 0 is because there is no 0 of clubs, our lowest card number is 2.

Alright, so what happens now? Well the loop completed so we go back to the first loop and increment i, right? Well, no. We run the loops based on how they are nested. So until j isn't less than suits.length, we keep running that loop incrementing j each time. Basically, we are going to run this loop until we have created a 2 card for each suit. Now, once we have done that our for loop is no longer true, so we jump back out into our original loop and we increment i by one. We will repeat this processes until we have created all 52 cards! Much easier than manually creating an Array of 52 cards.

Now let's take a look at how we could go about this in Ruby. Wait, where's the for loop and how do we know when to stop? I told you that Ruby had a few more tricks up it's sleeve, when it came to iterating! We are actually controlling everything with the .each method. This is built into Ruby's library and will iterate over "each" element.

So this is getting long and I'm sure that you are bored, so will break this down fairly quickly. First we create some variables values, which is equal to a range of numbers from 2 to 14, suits, which is an Array of our 4 suits, and lastly cards, which is an empty Array to hold our cards. So far, this is looking pretty similar to JavaScript with the exception of adding the variable values.

Now let's jump into the code! Again, because of the .each method in Ruby, there is no need to actually create a for loop. Here we are saying that for each element within the Array of suits, run this code block. Similar to what we did in JavaScript, I have nested another code block within suits. This is saying that of each number in the range of values run the code block. That code block pushes the current value of values and the current element of suits into our cards Array. This process will repeat until we have iterated through each element of values for each element of suits.

And the winner is!?

Well for efficiency and brevity of code, I would have to say Ruby. But let's face it, whether we are using a traditional for loop, which we still could have done for Ruby, or we are using built in methods like .each, ultimately we achieved the same thing; we created a brand new deck of cards! So pat yourself on the back and let's call it a day!