Looping In Javascript
Tags: programming, javascript, looping, loops
Published: 2020-05-20 10:30:50

---
title: Looping In Javascript
published: true
date: 2020-05-20 10:29:06 UTC
tags: programming,javascript,looping,loops
canonical_url: 
---

Loops in programming are pretty useful, its a way of automating a task or function thus saving you time (writing less code). I’ve heard that loops are almost identical in most languages but my experience so far is with Javascript so I’ll talk about loops **specifically in Javascript**. ![🙂](https://s0.wp.com/wp-content/mu-plugins/wpcom-smileys/twemoji/2/72x72/1f642.png)

Okay so there’s basically 4 common types of loops:

- **For loop**
- **For Each loop**
- **While loop**
- **Do**  **While loop**

In the spirit of this blog not being too long, I’m gonna explain (with examples) only two of the four loops mentioned above, maybe I’ll do a second part where I explain the rest… ![🙂](https://s0.wp.com/wp-content/mu-plugins/wpcom-smileys/twemoji/2/72x72/1f642.png)

## the For loop

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

Here’s what the code above is doing: first a variable _ **x** _ is declared and assigned the number _ **10** _ (therefore x = 10). Then a _local_ variable **_i_** is declared and assigned the number _ **0** _ (therefore i = 0). Now **_for_** as long as _ **i** _ is **_less than_** _ **x** _ add 1 to the variable _ **i** _ and return the **_current_** value of **_i_**. This is basically counting from 0 to 9. Now you may be confused by this a bit because **_x = 10_** so why isn’t the program counting to 10?

Here’s why:

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

The previous example counted 0 to 9 because of one reason, **_the condition_** (i < x), this tells the program _as long as i is **less than** x_, so it will stop running once it gets to 9 because if it continues the **_condition_** will no longer be true (if _i = 10_ then _i < x_ is false). Now consider the example above, you’ll notice that the **_condition_** has now changed from _i < x_ to _i <= x_. This will now count from 0 to 10 because of the equal sign. That’s a **for loop.**

## the For Each loop

```
const [a, b, c] = ['first letter', 'second letter', 'third letter'];

let [...letters] = [a, b, c];

letters.forEach(letter => {
   console.log(letter);
})
```

Variables **_a b c_** are declared and assigned **_first letter, second letter, third letter_** accordingly. Then they are collected into one variable **_letters_** , notice I said “collected”… that’s because **_letters_** is actually an Array containing 3 variables _a, b, c_. Now **_ForEach_** of those **_letters_** return an individual letter’s value. If you run this code it will output a list like this:

- first letter
- second letter
- third letter

and then stop running. That’s a **ForEach loop**.

There’s also something called an Infinite loop, this is when a program keeps performing a defined task an **infinite** amount of times. Here’s an example:

```
const x = 2;
for(let i = 3; i > x; i++){
   console.log(i)
}
```

DO NOT run this code, ![😵](https://s0.wp.com/wp-content/mu-plugins/wpcom-smileys/twemoji/2/72x72/1f635.png) ![☠](https://s0.wp.com/wp-content/mu-plugins/wpcom-smileys/twemoji/2/72x72/2620.png) it will crash your browser (and may crash your PC altogether depending on your specs). Variable _ **x** _ equals **_2_** , variable **_i_** equals **_3_** then **_i_** has to keep adding 1 _as long as_ _ **i** _ _is more than_ _ **x** __._ (this condition will forever evaluate to true, therefore the loop won’t stop running, thus resulting an **infinite loop** ).

Like I said in the intro, I don’t want this blog to be long so I’ll end it here.

Alright cool. ![✌](https://s0.wp.com/wp-content/mu-plugins/wpcom-smileys/twemoji/2/72x72/270c.png)