Object Oriented Programming

Here are some of the steps in the OOP part of the FCC stuff.

Simple object method.

let dog = {
  name: "Spot",
  numLegs: 4,
  sayLegs: function() {return `This dog has ${this.numLegs} legs.`;}  
};
dog.sayLegs();
1
2
3
4
5
6

Difference between own properties and prototype properties

Own properties are defined on the object instance and so each instance of the object has the property individually and they can be different for each instance. Prototype properties are shared by all instances of the object - each property exists once only in the prototype for the object.

function Dog(name) {
  this.name = name;
}
Dog.prototype.numLegs = 4;

let beagle = new Dog("Snoopy");
//let beagle = Object.create(Dog.prototype);
let ownProps = [];
let prototypeProps = [];

for (let prop in beagle) {
  if(beagle.hasOwnProperty(prop)) {
    ownProps.push(prop);
  } else {
    prototypeProps.push(prop); // not own prop so must be from the prototype
  }
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

Some basic stuff on inheritance

function Animal() { }
Animal.prototype.eat = function() { console.log('yummy'); };
// instance of Animal - animal.eat() will print yummy to console
function Dog() { }
Dog.prototype = Object.create(Animal.prototype);
// instance of Dog - dog.eat() will now print yummy to console
Dog.prototype.constructor = Dog; //overwrite the inherited constructor
Dog.prototype.bark = function() {console.log('Woof!');} //add a dog specific property

let beagle = new Dog();
beagle.eat(); // Should print "yummy"
beagle.bark(); // Should print "Woof!"
1
2
3
4
5
6
7
8
9
10
11
12

Use a Mixin to Add Common Behavior Between Unrelated Objects

A mixin in this sense is merely a function that can add a property or method to any object without involving inheritance. Seems like an unnecessary extra piece of terminology to me.

let bird = {
  name: "Donald",
  numLegs: 2
};
let boat = {
  name: "Warrior",
  type: "race-boat"
};
let glideMixin = function(o) {
    o.glide = function() {
        console.log("I can glide");
    }
}
glideMixin(boat);
glideMixin(bird);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

Intro to private properties

Use let to declare a scoped variable that is invisible outside the object itself, must therefore provide a public function that can return the variable. Getter and setter again..?

function Bird() {
  this.wings = 2; //public 
  let weight = 15; //private
  this.getWeight = function() { //public function
    return weight;
  }
}
1
2
3
4
5
6
7

Use an immediate invocation to Create a Module

Instead of creating a bunch of mixins individually, this example shows how to create a 'module' - it is just another object - of which the mixins are properties. Uses an anonymous function and IIFE to create the object / module, the methods inside of which can then be applied to any object.

let funModule = (function () {
  return {
    isCuteMixin: function(obj) {
      obj.isCute = function() {
        return true;
      };
    },
    singMixin: function(obj) {
      obj.sing = function() {
        console.log("Singing in the rain");
      };
    }
  }
})();
let puppy = new Object();
funModule.isCuteMixin(puppy);
console.log(puppy.isCute());
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17