-
Chapter 10 Objects
-
Chapter 11 Arrays
-
video - 6.1 Intro to ES6 OOP (~2 min)
-
video - 6.2 Writing a Class (~20 min)
-
video - 6.3 Constructor Arguments (~8 min)
-
video - 7.2 Arrays and loops (~9 min)
-
video - 7.3 Arrays of objects (~15 min)
-
Extra video tutorial: for...of loop (~4 min)
-
video - 7.5 Removing objects from arrays (~19 min)
-
video - 7.6: Object Communication Part 1 (~14 min)
-
video - 7.7: Object Communication Part 2 (~19 min)
-
7.8: Objects and Images - video tutorial (~17 min)
-
Tutorial. The pixel array: Pushin Pusheen Pixels
-
- sketch - Snowfall (~53 min)
As you may have noted from the readings there are a few different ways of managing objects. You can use simple object literals or create objects from classes. You can start with object literals and as your sketch builds up in complexity you may find it clearer to use classes, especially if you have more than one distinct behaviors to manage.
sketch - A Snake Following the Mouse
Array of object literal with properties x and y.
sketch - drag trail of n bubbles
Array of objects using modern Javascript class Bubble.
sketch - Ex_11_09 Managing Many Objects
JitterBug example using old function style objects from "Getting Started..." book.
sketch - Ex_11_09 Managing Many Objects-remix
JitterBug example re-mixed to use modern Javascript class.
Compare these examples. Run them and examine the array of objects in interactive console. Note the difference between object literals and class objects.
sketch - Ex 6.2 JitterBug re-mix
The JitterBug example re-mixed to use a button to add JitterBugs to canvas.
- add logic to keep the bugs on the canvas
sketch - Ex 6.2 JitterBug clamped
- modify to drag to create bugs
sketch - Ex 6.2 JitterBug drag
- limit the number of bugs created
sketch - Ex 6.2 JitterBug limit
- reduce the randomness and draw lines between the bugs
sketch - Ex 6.2 JitterBug line
- modify to draw individual figures
- add button to save figure as JSON
- animated drawn figures
- replicate figures at different sizes and positions
Sketches from the Getting Started book You are invited to remix and combine them to further explore.
- Chapter 10 Objects
Ex_10_01 Make an Object
Ex_10_02 Make Multiple Objects
Ex_10_99 Robot Object
- Chapter 11 Arrays
Ex_11_01 Many Variables
Ex_11_02 Too Many Variables
Ex_11_03 Arrays, Not Variables
Ex_11_04 Declare and Assign an Array
Ex_11_05 Assigning to an Array in One Go
Ex_11_06 Revisiting the First Example
Ex_11_07 Filling an Array in a for Loop
Ex_11_08 Track Mouse Movements
Ex_11_09 Managing Many Objects
Ex_11_10 Sequences of Images
Ex_11_99 Robot Array