Explore the basics of JavaScript in greater detail to solve real-world problems.

Zero to Hero in JavaScript

This module aims to teach us how to write cleaner, more modular, and more scalable code in JavaScript by giving us an understanding of object-oriented programming (OOP). We'll start with the basics of object-oriented programming and build up to more advanced concepts such as data protection and inheritance. Along the way, we'll learn how each concept applies to JavaScript in particular, as well as how various JavaScript features make it a suitable language for object-oriented programming.

JavaScript: A Deep Dive

In this lesson, we will see how loops *iterate* arrays, where iterate means accessing elements in the *array one by one*.


# Iterating single-dimensional arrays
 
To iterate a **single dimension array**, we design a loop that will *index* each element and *terminate* when the end is reached. Take for example the following array:


```Javascript
var arr = [ 10, 25, 7, 100, 20 ];
```

 To *iterate* it, we start off with the first element (index `0`) and end at the last element (index `4`).

Notice a couple of things:

1. The indexing starts from *`0`*.
2. The index in each iteration is *incremented by one*.
3. The indexing stops at the *last index*, which is always one less than the length of the array.

With these observations in mind, use the `for` loop to iterate `arr` as shown below.

var arr = [10, 25, 7, 100, 20]; // initialise arr
// iterate array from start to end
for(var i = 0; i < arr.length; i++){
  console.log(arr[i]);
}
console.log("indexing complete");

In the above code, we use the **`for` loop** to *iterate* the **array** `arr`. We use `i` to *index* the **array** `arr`. Since `i` is  used to *index*, we need to initialize it to the *first index* of the **array**, which is `0`. So within the `for` loop, we initialize `i` to `0`. In each iteration, the **array's** element is printed on **line 4**. To iterate each element, we *increment* the value of `i` by one using the `++` operator. To ensure *all elements* are iterated once, we bind the **condition** of the `for` loop by the *length* of the **array**. From the printed result, we can see that all elements of the array are traversed.  

>**NOTE:** We can use a `while` loop to do what the `for` loop is doing. Try creating  a `while` loop to *traverse* an array.

Similarly, we can iterate the array in *reverse* order, starting from the *last element*.

Use loops to iterate an array in JavaScript.

Iterating Arrays

Iterating single-dimensional arrays