webdesserts · August 29, 2015 14:10 · Dec 10, 2014 · Dec 2, 2014 · Dec 2, 2014 · Dec 2, 2014
diff --git a/prototype.js b/prototype.js
@@ -3,7 +3,7 @@ var Point = {}
 
 // create an object like this one, but with a clean state
 Point.create = function create () {
-  new_shape = Object.create(this)
+  var new_shape = Object.create(this)
   new_shape.init.apply(new_shape, arguments)
   return new_shape
 }

diff --git a/prototype.js b/prototype.js
@@ -71,4 +71,10 @@ Shape.move(5, 0)
 Shape.x // 10
 Shape.y // 20
 
-// No More Classes! Just objects!
+// No More Classes! Just objects!
+
+// Here's what the resulting prototype chain might look like:
+//
+// Point <- point
+//      \
+//       <- Shape <- square <- cube
diff --git a/prototype.js b/prototype.js
@@ -37,12 +37,12 @@ Shape.init = function (x, y, width, height) {
 }
 
 // and of course, we can continue to tack on to the prototype chain
-square = Shape.create(1, 1, 20, 20)
+var square = Shape.create(1, 1, 20, 20)
 
 // what's even cooler, is that since every object inherits the .create() method
 // from their "Class" (and the classes are just normal objects anyway) every
 // object can act like a "Class"!
-cube = square.create(9, 9, 30, 30)
+var cube = square.create(9, 9, 30, 30)
 cube.x = 9
 cube.depth = 30
 

diff --git a/prototype.js b/prototype.js
@@ -1,5 +1,5 @@
 // create a "Class-like" object
-Point = {}
+var Point = {}
 
 // create an object like this one, but with a clean state
 Point.create = function create () {
@@ -19,13 +19,13 @@ Point.move = function move (x, y) {
   this.y += y
 }
 
-// creates a point with an x & y of 5
-point = Point.create(5, 5)
+// we can create objects based off the original Point
+var point = Point.create(5, 5)
 point.x // 5
 point.y // 5
 
 // Or we can create more "Class-like" structures
-Shape = Object.create(Point)
+var Shape = Object.create(Point)
 
 // add some extra state to Shape without affecting state on Point
 Shape.init = function (x, y, width, height) {
@@ -36,11 +36,12 @@ Shape.init = function (x, y, width, height) {
   this.height = height
 }
 
-// and of course, we can continue to the prototype chain
+// and of course, we can continue to tack on to the prototype chain
 square = Shape.create(1, 1, 20, 20)
 
-// what's even cooler, is that since every object inherits the create method
-// every object is a "Class"!
+// what's even cooler, is that since every object inherits the .create() method
+// from their "Class" (and the classes are just normal objects anyway) every
+// object can act like a "Class"!
 cube = square.create(9, 9, 30, 30)
 cube.x = 9
 cube.depth = 30
@@ -69,3 +70,5 @@ Shape.y // 20
 Shape.move(5, 0)
 Shape.x // 10
 Shape.y // 20
+
+// No More Classes! Just objects!
diff --git a/prototype.js b/prototype.js
@@ -0,0 +1,71 @@
+// create a "Class-like" object
+Point = {}
+
+// create an object like this one, but with a clean state
+Point.create = function create () {
+  new_shape = Object.create(this)
+  new_shape.init.apply(new_shape, arguments)
+  return new_shape
+}
+
+// initialize all state
+Point.init = function init (x, y) {
+  this.x = x
+  this.y = y
+}
+
+Point.move = function move (x, y) {
+  this.x += x
+  this.y += y
+}
+
+// creates a point with an x & y of 5
+point = Point.create(5, 5)
+point.x // 5
+point.y // 5
+
+// Or we can create more "Class-like" structures
+Shape = Object.create(Point)
+
+// add some extra state to Shape without affecting state on Point
+Shape.init = function (x, y, width, height) {
+  // do everything our prototype does
+  Object.getPrototypeOf(Shape).init.call(this, x, y)
+  // and add some extra state
+  this.width = width
+  this.height = height
+}
+
+// and of course, we can continue to the prototype chain
+square = Shape.create(1, 1, 20, 20)
+
+// what's even cooler, is that since every object inherits the create method
+// every object is a "Class"!
+cube = square.create(9, 9, 30, 30)
+cube.x = 9
+cube.depth = 30
+
+// and we can still use methods defined further up the chain
+cube.move(-5, -5)
+cube.x // 4
+cube.y // 4
+
+// ...or write our own version
+cube.move = function (x, y, z) {
+  Object.getPrototypeOf(this).move.call(this, x, y)
+  this.z += z
+} 
+
+cube.move(-1, 1, -2)
+cube.x // 3
+cube.y // 5
+cube.z // 6
+
+// Oh and since our "Classes" are just objects. We can use them as such.
+Shape.init(5, 20)
+Shape.x // 5
+Shape.y // 20
+
+Shape.move(5, 0)
+Shape.x // 10
+Shape.y // 20