Loops and Arrays

Loops allows us to repeat some statements based on counter or conditions. In javaScript there are 4 ways to construct loops

  1. Using the for statement.
  2. Using the while statement.
  3. Using the do while statements.
  4. Using the for in statement.

The For statement

The for statement is built as follows

for (var i = 0; i <= 10; i++){
    Statement 1;
}

Each element in the “for” statement is separated by e semicolon. I will explain what this elements are used for

  1. var i=0 We are assigning the initial value of 0 to the variable i that in this case is the variable that will indicate how many times the code is going to be executed.
  2. i <= 0 this is setting the condition that must be met for the “for” loop to be executed in case the condition is not met the condition will not be executed.
  3. i++ this is the part where our i variable will be incremented.

The for loop is the most used one by programmers.

Note many programmers start the count on this kind of loops with the value of 0 because elements on an array start from 0 we will talk about arrays latter on in this page.

The While Statement

The while statement works as follows

while (i <= 10){
    Statement 1;
    i = i ++;
}

In this case we are indicating our computer to execute Statement 1 while the variable i is less or equal to 10 and we are incrementing i with the following statement i = i++;

The do while statement

The do while statement works as follows.

do{
    Statement 1;
    i=i ++;
}while (i<=10);

The main difference between a while and a do while statement is that a do while statement will always execute a least one time due that the condition will be evaluated after Statement 1 has been executed.

Array

Arrays are collections of values, or can be seen as list of values. In JavaScript is different from other programming languages since it allows an array to have different data types in the same array. Visually an array can be seen as shown in the following image.

array diagram

In JavaScript arrays are declared as follows

var cars[];

This is an empty array, so how can we assign values to this array? We can assign values to array in different ways.

var cars = [“Chev”,”Ford”,”Buick”,”Truck”];

Or you can use the index number to do the assignment

    var cars=[];
    cars[0] =”Chev”;
    cars[1] =”Ford”;
    cars[2] =”Buick”;
    cars[3] =”Lincoln”;
    cars[4] =”Truck”;

We can do this same thing with less lines of code using loops to do it. We do this as shown in the example below.

var myArray[];

for (i=0;i<=5;i++){
    myArray[i]=”item ”+ i;
}

Assigning values this way we will have a collection of values as follows

    myArray[0]=”item 0”;
    myArray[0]=”item 1”;
    myArray[0]=”item 2”;
    myArray[0]=”item 3”;
    myArray[0]=”item 4”;

We can do this also by using the push which will add the elements at the end of the array method as follows.

var myArray[];

for (i=0;i<=5;i++){
        myArray[i].push(“item ” + i);
}

To access the values of an array we can do it with the use of a loop and the method length that returns the size of our array. We can assign this values to a variable or show them in the HTML page as follows


var myArray[];
var myArrayValue;

for (i=0;i<=myArray.length;i++){
        myArrayValue=myArray[i];
}