DA1:TIPS: Iteration (while and for loops)

While

The while loop structure resembles the if statement, with one key difference: an if statement is only executed once and the while loop is going to repeat itself as long as the expression is true. Note: Because of this functionality, it is important to make sure that the while does not get stuck in an infinite loop. So make sure that there is a way for the expression to become false.

while (expression) {
  statements
}

How is this useful? Let’s say you wanted to draw a bunch of rectangles side by side:

void setup(){
 size(640,280);
}

void draw(){
 background(255);
 int x = 0;
 int y = height/2;
 while(x<width){
    fill(255);
    rect(x,y,64,64);
    fill(0);
    text(x,x,y);
    x = x + 64;
 }
}

Each rectangle is 64 pixels wide and each of them is drawn 64 pixels to the right of the previous rectangle. The x variable is used as a way to be able to escape the while loop

For

As you can see, when you use the while loop you often need:

1. a variable that you reset in the beginning
2. an expression that compares that variable to some kind of limit
3. and some kind of update statement that changes the variable (often you increment this value by some amount)

This is such a common structure and you often end up using it all the time. Therefore, a specific loop exists to do just this. This is the for loop.

for (init; test; update) { 
 statements
}

void setup(){
 size(640,280);
} 

void draw(){
 background(255);
 int y = height/2;
 for(int x = 0; x<width; x = x +64){
    fill(255);
    rect(x,y,64,64);
    fill(0);
    text(x,x,y);
 }
}

In the examples above, we use the for loop in a structure where the variable controlling the loop is used to directly control our drawing. The variable is called x, we add 64 to the value of x after each loop.

A more common structure is to separate the for loop structure and the variable manipulation. So you will often see something like this:

for(int i = 0; i < 10; i++){
   //your code goes here
}

• The variable i starts from 0 and after each loop we add 1 to the value of i:
  (i++ is the same as i=i+1)
• The expression we use in the second part (i <10) of the for defines how many times the loop is repeated. In this case the loop runs 10 times.
• Every time the loop runs, the value of i counts up, and we essentially count from 0 to 9

Examples

Here is an image that is drawn multiple times. The upper row is drawn using a while loop and the lower row is drawn using a for loop. Note the similarities in the code. Using a for loop is often much more convenient, since you anyway need to build the control structure for your expression. I would recommend using the for loop for most of the cases where you need repeat something multiple times.

This is the example we worked on during the class (5/3/2018). I cleaned it up a little bit. This demonstrates the way a for loop can be used for going through an array of values.

The example below shows how you can draw a grid using two nested for loops.