DEV Community

Mazin Idris
Mazin Idris

Posted on

JavaScript Loops

Do you think you understand for-loops in JavaScript? Do you want to test your JavaScript for-loops knowledge? You came to the right place!

What are JavaScript For-Loops
JavaScript For-Loops are just loops. They exist in almost every single programming language. Like the name suggests, loops will loop and in our case it would loop JavaScript code! So you can run a certain set of JavaScript code x number of times! However there two important things in regards to for-loops that one must be aware of.

Index in JavaScript For-Loops
When you have a for-loop you will have access to something called an index. Index is an integer (plain number). You can start at 0 or 1 or 2 or even -35. Your choice! You will have access to this index which by the way you can call anything you want in the set of code that you loop through. Most developers choose to call this index “i” without the quotes.

JavaScript For-Loops are Mostly Used in Arrays!
Make no mistake. JavaScript for-loops are mostly used in Arrays. Remember what arrays are. They are just a collection of stuff. So if you want to go through every single element in your array you can use a for-loop! Simple right? You have a bunch of data in an array and you want to…let’s say….print them out to the screen or console. You can use a for-loop for that!

How a JavaScript For-Loop Looks Like

for (let i = 1; i <= 10; i++) {
  console.log(i);
}
Enter fullscreen mode Exit fullscreen mode

This prints

1

2

3

4

5

6

7

8

9

10

Simple right? Well, let’s break it out real quick.

JavaScript For-Loop Syntax
I am just going to focus on the inner part of the parenthesis ()

Part 1) i = 1

Start our “count” at 1

Part 2) i <= 10

Keep going as long as i is less than or equal to 10

Part 3) i++

Increase i by one everytime

That’s it!

JavaScript For-Loops with Arrays
I feel like any description of JavaScript for-loops without including arrays is an inadequate description. So here we go.

We have an array

let arr = ["Ricciardo", "Verstappen", "Bottas"];
Enter fullscreen mode Exit fullscreen mode

So now let’s print out every single element to the console or screen.

for (let i = 0; i < arr.length; i++) {
  console.log(arr[i]);
}
Enter fullscreen mode Exit fullscreen mode

This will print

Ricciardo

Verstappen

Bottas

Simple right? At least I hope it is.

Now to the exercise! Don’t be nervous. No one is watching you and it is not timed. In fact, no one gives a shit if you do well or not so…no pressure!

JavaScript for-loop Exercise
Using a for loop output the elements in reverse order

let arr = [43, "what", 9, true, "cannot", false, "be", 3, true];
Enter fullscreen mode Exit fullscreen mode

// Example output:
// true 3.5 be false cannot true 9 what 43 OR each item on a new line

Conclusion
Hope JavaScript for-loops make just a little more sense now. If it doesn’t, feel free to schedule a one-on-one tutoring session with me. I would love to help you understand it better.

Top comments (0)