Atomic surface of a silicon crystal, Northwestern University
Peacock feathers, photo by Paul Canning
Repeating patterns in art
Tibetan Sand Painting Mandala
James Michael quilt
Moorish Tile Pattern Marrakech, 1600s
Art Deco pattern, 1920s
Sol LeWitt wall drawings, 1960s
Bridget Riley painting, 1980s
Bridget Riley at the Hayward
Alison Gondek, Circular Gallifreyan pattern in JavaScript, 2010s
Writing loops
Used to repeat actions quickly.
Syntax
for ( let counter=0; counter < 100; counter++ ) {
rect(counter, counter, 10, 10);
} ;
😬 Avoiding an infinite loop ♾
🛠 Turn off auto-refresh!
🛠 You can stop the draw() loop by adding noLoop() to setup().
Global variables
If you'll refer to a variable throughout your code, define it in setup() without any keyword.
setup() {
playerHealth = 100; // This variable can be used anywhere.
}
A variable defined above setup() with let is also global.
let playerHealth = 100; // This variable can be used anywhere.
setup() {
...
}
Local variables
If you'll use a variable just once, in draw() or a custom function, precede it with the keyword let. That way you can use the same variable to mean different things in different contexts.
draw() {
for (let counter = 0; counter < numberOfTacos; counter++) {
// This 🌮 counter will be used in this loop and then forgotten.
}
...
for (let counter = 0; counter < numberOfHits; counter++) {
// This 💥 counter is different from the one in the previous loop.
}
}
🎩 var is like let, and const is like a global variable. You won't need them for this course.
Incrementing variables
Incrementing means adding or subtracting a number (often 1).
🎩 You can use -- to reduce a variable by one, just as you use ++ to increase it by one.
draw() {
// Get stronger when you eat meals 🌮.
for (let counter = 0; counter < numberOfMeals; counter++) {
playerHealth++;
}
// Get weaker when you get shot 💥.
for (let counter = 0; counter < numberOfHits; counter++) {
playerHealth--;
}
}
Rewriting code quickly
🎩 Find and replace (you may have to click twice!).
🎩 Hold Option/Alt key to change a column of characters, eg in star loop pattern.
