Loops are similar to conditions except that after every iteration of the loop, the expression is checked again.
Chapter 6 of Learning Processing by Danel Shiffman.
Now, lets look at these concepts again, being precise about all the details.
Firstly, loops are statements not expressions, for the same reasons as if
statements. That means they don’t have an equivalent value. Instead, they are useful because of what they do.
Both loops and if
statements are called “controlflow” statements because they change the flow of the program from toptobottom to somethings more complex. We will see another control flow statement when we see functions.
while
loop1
2
3
4
while(boolean expression) {
code inside loop
}
rest of the code
Example:
1
2
3
4
5
6
7
int a = 6;
int result = 1;
while(a > 0) {
result = result * a;
a = a  1;
}
println(result);
The above code executes the loop 6 times (for a
= 6,5,4,3,2,1 but not for 0) each time multiplying the current value of a
into result
and the final value of result
is 6*5*4*3*2*1 = 720.
There is a better way of tracing loops known as logic table construction. The logic table for the above example is given below.
a  a > 0  result 

6  true  1*6 = 6 
5  true  6*5 = 30 
4  true  30*4 = 120 
3  true  120*3 = 360 
2  true  360*2 = 720 
1  true  720*1 = 720 
0  false 
While constructing a logic table, one is strongly encouraged to follow the following steps:
x==y && !z
, the variables involved are x
, y
, and z
and the subexpressions are x==y
and !z
.1
2
3
4
5
6
7
int a = 10, b = 2, c = 100;
int result = 0;
while(a > b && c > a) {
result = result + 1;
a = a  1;
c = c / 2;
}
a  b  c  a > b  c > a  a > b && c > a  result 

10  2  100  true  true  true  0+1 = 1 
9  2  50  true  true  true  1+1 = 2 
8  2  25  true  true  true  2+1 = 3 
7  2  12  true  true  true  3+1 = 4 
6  2  6  true  false  false 
Note that we don’t have columns for a
and c
again even though they are modified inside the loop because columns for those variables are already present in the table by virtue of step 2.
Such a table is not a formal document, it is an aid to understanding and this means it is only valuable if it works for you. To this end, here is another table for the same problem. It is just as good as the other one, but might work better for you. Further, you should experiment with your own style rather than stick rigidly to these examples.
a  b  c  result  a > b  &&  c > a 

10  2  100  0  10>2 = T 
&&  100>10 = T 
T  &&  T  
T  
9  2  50  1  9>2 = T 
&&  50>9 = T 
T  &&  T  
T  
8  2  25  2  8>2 = T 
&&  25>8 = T 
T  &&  T  
T  
7  2  12  3  7>2 = T 
&&  12>7 = T 
T  &&  T  
T  
6  2  6  6>2 = T 
&&  6>6 = F 

T  &&  F  
F 
A forloop is more compact than the while loop and more common in reallife applications.
1
2
3
4
for(initializations; boolean expression; update(s)) {
code inside loop;
}
rest of the code;
Example:
1
2
3
4
5
int result = 0;
for(int i=1; i <= 16; i*=2) {
result = result + i;
}
println(result);
Trace (logic table):
i  i<=16  result 

1  true  0+1 = 1 
2  true  1+2 = 3 
4  true  3+4 = 7 
8  true  7+8 = 15 
16  true  15+16 = 31 
32  false 
Modify your animated blue circle so that it is an animated blue bullseye instead. Hint: You can get a thin circle using noFill
and a larger strokeWeight
value;
Instead of drawing a simple circle, we draw three circles, each 10 pixels larger than the last. Each has a 2 pixel border, making a bulleye shape. Nothing else needs to change, the center of the bullsye animates in exactly the same way as the circle did.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
int ypos;
int speed;
void setup(){
ypos = 0;
speed = 1;
}
void draw(){
background(255);
if (ypos == height){
speed = 1;
}
if (ypos == 0){
speed = 1;
}
noFill();
stroke(92, 136, 218);
strokeWeight(2);
for(int i = 0; i < 40; i = i + 10){
circle(width/2, ypos, i);
}
ypos = ypos + speed;
}
As discussed in the above video, the fact that processing is always in a “draw loop” can confuse things somewhat. It is possible to see all the operation of loops free of this constraint if we work only on the console. The console is the black area below your program and it is available even when you do a “static” processing program (one that has no setup
or draw
).
Using loops, draw five ^
(hat) characters to the console
1
2
3
for(int i = 0; i < 5; i++){
print('^');
}
Notice that this program has no setup
and no draw
functions, it is a special type of nonanimated Processing program.
Control structures are literally like lego blocks, you can arrange them as you want, depending on the situation. So you can put loops/conditions inside other loops/conditions (and then more loops/conditions inside that and so on).
Let’s take some examples of a situation where such nesting is required.
We would like to generate a pattern based on input integer N > 0
N=4
1
2
3
4
^
^ ^
^ ^ ^
^ ^ ^ ^
N=6
1
2
3
4
5
6
^
^ ^
^ ^ ^
^ ^ ^ ^
^ ^ ^ ^ ^
^ ^ ^ ^ ^ ^
STEP 1: There are N
lines.
Outer loop 
1
2
3
4
for(int i=1; i<=N; i++) {
display current line
change line using println();
}
STEP 2: Line corresponding to a given value of i
has i
caps
(when i = 1
, there is 1 cap, when i = 2
there are 2 caps, and so on …).
Inner loop 
1
2
3
for(int k=1; k<=i; k++) {
print("^");
}
COMPLETE SOLUTION
1
2
3
4
5
6
for(int i=1; i<=N; i++) {
for(int k=1; k<=i; k++) {
print("^");
}
println();
}
Change the code so that the symbols alternate between a cap (^) and a dash () between lines.
N=6
1
2
3
4
5
6
^
 
^ ^ ^
   
^ ^ ^ ^ ^
     
The difference from scenario 1 is that if outer loop counter i
is an odd number, it’s a cap (^
) while if the outer loop counter i
is an even number, it’s a dash (
).
So the earlier display statement
1
print("^");
will change to,
1
2
3
4
5
6
if(i%2 == 1) { //odd counter: cap
print("^");
}
else { //even counter: dash
print("");
}
1
2
3
4
5
6
7
8
9
10
11
for(int i=1; i<=N; i++) {
for(int k=1; k<=i; k++) {
if(i%2 == 1) { //odd counter: cap
print("^");
}
else { //even counter: dash
print("");
}
}
println();
}
Change the code so that the symbols alternate between ^ and  within a line.
N=6
1
2
3
4
5
6
^
^ 
^  ^
^  ^ 
^  ^  ^
^  ^  ^ 
The only change required is to use k
instead of i
to decide what symbol to print
1
2
3
4
5
6
7
8
9
10
11
int N = 6;
for(int i=1; i<=N; i++) {
for(int k=1; k<=i; k++) {
if (k % 2 == 1)
print("^");
else
print("");
}
println();
}
Change the code so that the symbols alternate between ^ and  within a line and also the first symbol on each line is different from the first symbol on the previous line
N=6
1
2
3
4
5
6
^
 ^
^  ^
 ^  ^
^  ^  ^
 ^  ^  ^
This seems like a curly problem until we realise that adding k
and i
will give the pattern required because i
goes up by one each line, swapping the “oddness” of each slot in that row.
1
2
3
4
5
6
7
8
9
10
11
int N = 6;
for(int i=1; i<=N; i++) {
for(int k=1; k<=i; k++) {
if ((k+i) % 2 == 0)
print("^");
else
print("");
}
println();
}
Just like in conditions, lets see some realworld scenarios where we need to use loops.
But there is a problem. Loops usually iterate over a collection (an array, list, hashmap, etc). Since we can’t assume knowledge of the same in this document, we’re in a bit of a pickle, aren’t we?
So, instead we’ll iterate over numbers generated via a randomnumber generator.
For scenarios 1 to 3, you may assume that n
is generated using the following statement:
1
2
int x = 1 + (int)random(100); //x can be any integer from 1 to 100
int n = 10*x; //n can be one of the values from [10, 20, ..., 1000]
Write a piece of code that determines the number of times we get a 6 when a normal 6faced die is rolled n
times.
1
2
3
4
5
6
7
8
9
10
11
int x = 1 + (int)random(100); //x can be any integer from 1 to 100
int n = 10*x; //n can be one of the values from [10, 20, ..., 1000]
int total = 0;
for(int i = 0; i < n; i++){
int thisRoll = (int)random(1,7);
if (thisRoll == 6){
total++;
}
}
println(total);
Write a piece of code that determines the average outcome when a normal 6faced dice is rolled n
times.
You should expect to get 3 just about every time right?
1
2
3
4
5
6
7
8
9
int x = 1 + (int)random(100); //x can be any integer from 1 to 100
int n = 10*x; //n can be one of the values from [10, 20, ..., 1000]
int total = 0;
for(int i = 0; i < n; i++){
int thisRoll = (int)random(1,7);
total = total+thisRoll;
}
println(total/n);
For this scenario, you should assume that n
is generated using the following statement:
1
int n = (int)random(101); //n can be any integer from 0 to 100
Consider a party where there are 4 people. Call them Alice, Bob, Charles and Diane. Assuming they are all friendly and logical people, the following handshakes will take place:
Thus, there are 3+2+1 = 6 handshakes for 4 people.
If a fifth person (Eddie) joins the party, he shakes hands with all others.
Thus, there are 4
+3+2+1 = 10 handshakes for 5 people.
A table summarizing this pattern is given below,
Number of people  Number of handshakes 

1  0 
2  1 
3  2+1 
4  3+2+1 
5  4+3+2+1 
…  
n  (n1) + (n2) + …. + 2 + 1 
There is actually a very elegant formula to get this value, but for the purpose of our exercise, we’d like you to compute the number of handshakes in a party of n
people using a loop.
1
2
3
4
5
6
7
8
9
10
11
int n = (int)random(101); //x can be any integer from 1 to 100
int handshakes = 0;
for(int i = n1; i > 0; i){
handshakes = handshakes + i;
}
println(n + " people means");
println(handshakes + " handshakes");
</div>