​

//each function needs its own set of properties and its own set of functionality

//an object is a collection of name value pairs 

// an object has properties, each property has a name : value

// in addition to having these properties be simple variables with values, an object

//can  have a name be like " display" and the value can be a function 

​

//this is what makes objects really powerful its not just a collection of numbers

//or data or strings or colors its also the ability to use tose properties and 

//execute some code with those properties

// this is the amazing power of modularity and reusability of objects

//this program is modular in that there is this object that has these parts, its

// properties, its functions, i know which parts to edit when i want to change 

//how it looks or change how it moves  and its re useable 

​

var bubbles = []

​

​

function setup() {

  createCanvas(600, 600);

 for(var i = 0; i<400 ;i++){

  bubbles [i] = {

  x:random(0,width),

  y: random (0, height),

  display: function  (){

   stroke(50,255,100,50);

  strokeWeight(2);

   fill(255,100,250,50);

   ellipse( this.x, this.y, 24,24);

},

   move: function (){ 

   this.x= this.x+random(-2,2);

   this.y= this.y +random (-2,2);

},

  }

}

}

​

​

​

function draw() {

  background(55,155,200);

for (i = 0; i< bubbles.length; i++){

 bubbles[i].move();

 bubbles[i].display();

  }

}

​