Create ObjectOriented.md

ObjectOriented.md

@@ -0,0 +1,147 @@
+# Object Oriented Design in Javascript
+
+## Lesson Objectives
+
+1. Use JavaScript objects to model the real world
+1. Assign functions to variables
+1. Use methods to access properties of the object
+
+## Use JavaScript objects to model the real world
+
+Objects in javascript are just key/value pairs
+
+```javascript
+var matt = {
+	age: 36,
+	eyes: 'blue',
+	name: 'Matt'
+}
+```
+
+Can retrieve values using dot notation
+
+```javascript
+matt.age //returns 36
+```
+
+Can modify an object's properties like so:
+
+```javascript
+matt.age = 40;
+matt.eyes = 'green';
+```
+
+## Assign functions to variables
+
+Functions are objects and can be assigned to variables
+
+```javascript
+var myFunc = function(){
+	console.log('hi!');
+}
+
+myFunc();
+```
+
+Functions can be assigned to properties of objects.  These functions are referred to as methods of the object.  It's like having the object perform an action.
+
+```javascript
+var matt = {
+	sayHello: function(){
+		console.log('Hello, my name is Matt!');
+	}
+}
+
+matt.sayHello();
+```
+
+## Use methods to access properties of the object
+
+When invoking methods, you can reference other properties of the object with the keyword `this`
+
+```javascript
+var matt = {
+	name: 'Matt',
+	greet: function(){
+		console.log('Hello!  My name is' + this.name);
+	}
+}
+
+matt.greet(); //logs 'Hello!  My name is Matt'
+```
+
+## Object Oriented JS
+
+If you need to create multiple objects of the same type, object literals (`{ property:'value'}`) can be inefficient.  We can create constructor functions, which act like class declarations.
+
+```javascript
+var Person = function(){
+	this.numArms = 2; //use the this keyword to create properties and methods
+	this.numLegs = 2;
+}
+
+var me = new Person(); //use the new keyword to instantiate a new object
+var someoneElse = new Person();
+console.log(me);
+console.log(someoneElse);
+```
+
+We can pass parameters into constructor functions to make instances unique
+
+```javascript
+var Person = function(name){
+	this.name = name;
+	this.numArms = 2; //use the this keyword to create properties and methods
+	this.numLegs = 2;
+}
+
+var me = new Person('Matt'); //use the new keyword to instantiate a new object
+var someoneElse = new Person('Joey Jo-Jo Junior Shabadoo');
+console.log(me);
+console.log(someoneElse);
+```
+
+Methods act just like adding properties
+
+```javascript
+var Person = function(name){
+	this.name = name;
+	this.numArms = 2; //use the this keyword to create properties and methods
+	this.numLegs = 2;
+	this.sayHello = function(){
+		console.log("Hello, my name is " + this.name);
+	}
+}
+
+var me = new Person('Matt'); //use the new keyword to instantiate a new object
+me.sayHello();
+```
+
+<!-- Since functions are objects, we can create static properties/methods (properties and methods that relate to the class, not the instances of the class) by using dot notation
+
+```javascript
+var Person = function(){
+	/*
+	usual stuff here...
+	*/
+}
+
+Person.genders = ['male', 'female'];
+console.log(Person.genders);
+``` -->
+
+We can have a "class" inherit from another class, using the `.call` static method of a function
+
+```javascript
+var Car = function(){
+	this.wheels = 4;
+}
+
+var Humvee = function(){
+	Car.call(this);
+	this.numAmericanFlags = 4;
+}
+
+var murica = new Humvee();
+console.log(murica);
+```