The infinite of a Loop

The untold story of untold possibilities.

Photo by Reid Zura on Unsplash

Before I started coding (yes, about a month ago), I use to think of websites and apps as something useful, but I couldn’t understand the complexity of it, to me they were a bunch of images and words that you could click, touch, move, and some funny and cute things will happen.

I guess that being a user you never think about what happens behind the screens of our devices. My first coding experience left me with a great taste in my mouth. I said coding, but what I really did was following some instructions from school to download all the programs I needed to code, it was my first-time using line code in a terminal. For those who like me at that time, don’t know what a terminal is, it looks like this:

Photo by Nathana Rebouças on Unsplash

The instructions were very clear, and I did everything so good and fast that I patted myself on the back, I even allowed myself an overly pleased phone call to my friend to tell her how well I was doing. This thought makes me smile now.

Oh, how wrong I was!

Everything was pink, flowers and butterflies for about a week while I was happily going through the most basic theory, congratulating myself of my quick understanding, “Everything makes sense!” — I kept telling myself.

I even did some of the first assignments on my own, I told family and friends how this amazing and easy journey was going… Then some spines started to grow in my coding garden: Functions! Scope! Debugging! Conditionals!

But it wasn’t until I found LOOPS that I knew fear. By the time I was a week away from class (no, I’m not ashamed to say it) I was completely freaking out.

All the theory that made so much sense in my head was useless, for the second time in my life I felt the frustration of not being able to express myself. That sentence that you always repeat to everyone when you’re learning a new language kept coming to my head: “I understand what they’re saying but I can’t speak it”.

Before coding, a loop was this repetitive, boring, infinite thing… but this perspective changed when I understood what a Loop does in JavaScript, and then a Loop became just an infinite thing with infinite possibilities.

Now that I’m starting to see the light at the end of my tunnel, I’m finally letting my imagination go wild.

Photo by Tangerine Newt on Unsplash

But let’s get a bit technical. What is a loop in JavaScript?

A loop is a piece of code that allows you to run another piece of code a specific number of times (or even infinite times!).

You might be wondering “Why do I need to do this? - then let me tell you: If your mantra is “work smart not hard”, then we’re similar. And why would you write the same code over and over again, spend so much time and energy when your computer can just do it for you? Exactly!

There are a many cool things we can do with loops, so let’s explore our different types of loops:

• The for loop. Often used when we want to perform a specific number of iterations. It consists of three parts: the initialization, the condition, and the final expression. The initialization specifies the starting point of the loop, the condition is checked at the beginning of each iteration, and the final expression is executed at the end of each iteration.

for (let i = 0; i < 10; i++) {
  console.log(i);
}

This loop will start at 0 and will continue to run as long as i is less than 10. At the end of each iteration, i will be incremented by 1. As a result, this loop will print the numbers 0 through 9 to the console. You can create nested loops with the for loop.

• The while loop is used when we want to perform an unknown number of iterations. It consists of a single condition, and the loop will continue to run as long as that condition is true.

let i = 0;
while (i < 10) {
  console.log(i);
  i++;
}

This while loop will start at 0 and will continue to run as long as i is less than 10. At the end of each iteration, i will be incremented by 1. As a result, this loop will also print the numbers 0 through 9 to the console. We can also use the do...while loop, which is very similar but the condition is checked at the end of each iteration, rather than at the beginning. This means that the code inside the loop will always be executed at least once, even if the condition is false.

let i = 0;
do {
  console.log(i);
  i++;
} while (i < 10);

This do...while loop will also print the numbers 0 through 9 to the console, but it will always execute the code inside the loop at least once, regardless of the value of i.

• The for...in loop, which is used to iterate over the properties of an object. This loop consists of a single variable, which is used to hold the property names of the object.

const obj = {a: 1, b: 2, c: 3};
for (const prop in obj) {
  console.log(prop, obj[prop]);
}

This loop will iterate over the properties of the obj object and will print the property names and values to the console.

• The for...of loop, it’s a new type of loop created in 2015. It is used to iterate over the values of an iterable object, such as an array or a string.

const arr = [1, 2, 3, 4, 5];
for (const val of arr) {
  console.log(val);
}

One advantage of this loop is that it’s easier to read and understand, since it explicitly declares the variable that holds the current value of the iteration. It does not require the use of an index to access the values of the object. It works with any object that is iterable, not just arrays. This means that we can use it to iterate over strings, maps, and sets, as well as any other object.

• The forEach() method is a method of the Array object in JavaScript that allows us to execute a callback function on each element of an array. It is similar to the for...of loop, but it does not return a value and cannot be used with a break or continue statement.

const arr = [1, 2, 3, 4, 5];
arr.forEach(val => console.log(val));

This forEach() method will print the index and value of each element to the console.

In conclusion, loops have infinite possibilities, your wildest dreams and ideas can be built with loops (as long as they are a website or an app of course).

Do you want to buy fancy stuff online, sell them, play games, talk to friends, create a fan site for you doggy, map the worst restaurants in town, or even find your soulmate?

loopYourImaginationAway.forEach(ofYourDreams => (console.log('Yay!'))