mplatts
12/7/2014 - 1:21 AM

Javascript cheatsheet - http://www.letscodejavascript.com/v3/episodes/lessons_learned/12

function Parent(firstName, lastName){
  this._firstName = firstName;
  this._lastName = lastName;
}

Parent.prototype.fullName = function(){
  return this._firstName + " " + this._lastName;
}

// here we want to do the equivalent of coffeescripts "class Subclass extends Parent"
function SubParent(firstName, lastName){
  Parent.call(this, arguments)
  this._firstName = firstName + "!";
}

// Subparent prototype only has a constructor property - we want it to
// have all the properties of Parent's prototype
SubParent.prototype = Object.create(Parent.prototype)
// this creates a new object with the parent being Parent.prototype
// since Parent.prototype has a constructor of Parent we will need to change it
SubParent.prototype.constructor = SubParent;

subP = new SubParent("Matthew", "Platts");
console.log(subP._firstName); // what will this be?
var number1, number2;
number1 = 1;
number2 = number1;
number2 = 2;
console.log(number1) // Q1: What is it?

object1 = {a: 1};
object2 = object1;
object2.a = 2;
console.log(object1.a); // Q2: What is it?

object1.a = undefined;
delete object1.a;
// Q3: Which will actually remove the property?

// we can use Object.create(parent) to set the __proto__ reference

parent = {
  val: 1,
  getVal: function(){
    return this.val;
  }
}

child = Object.create(parent);
console.log(child.__proto__); // Q: what is this?
child.val = 2;
console.log(child.getVal()); // Q: what is this?

child.getVal = function(){
  return parent.getVal();
}

console.log(child.getVal()); // Q: what is this?

child.getVal = function(){
  return parent.getVal.call(this);
}

console.log(child.getVal()); // Q: what is this?
// A function is just an object with 3 properties already defined
function myFunction(){}
console.log(myFunction.name);
console.log(myFunction.length);
// Q: what is the 3rd property?

myFunction.foo = "bar"; // Q: is this okay? Why?

// 'this' refers to object which calls the function..so:
function getVal(){
  console.log(this.val);
}

myObject1 = {
  getVal: getVal,
  val: 1 
}
myObject2 = {
  getVal: getVal,
  val: 2 
}
console.log(myObject1.getVal()) // Q: what is this?
console.log(myObject2.getVal()) // Q: what is this?
console.log(getVal()) // Q: what is this in non-strict mode? Q: what is this in strict mode?

// call, apply, bind
console.log(getVal.call(object1)) // Q: what is this?
// if we keep using Object.create(parent), we might want the parent to
// have a constructor function so all children turn out the same

parent = {
  constructor: function(name) {
    this._name = name;
  }
}

child1 = Object.create(parent);
child1.constructor("Matt");
console.log(child._name); // What is this?

// when we create a function, it actually creates a second object...
// so here we have a Parent object
// but we also have Parent.prototype - a new object with one property on it:
// 'constructor', which just points back to the function you created
// So any function can be used as a constructor

// so instead of the above we can just go
ParentConstructor = function(name){
  this._name = name;
}
console.log(ParentConstructor.prototype); // a new object which just has 'constructor'
console.log(ParentConstructor.prototype.constructor); // points to Parent function

child1 = Object.create(ParentConstructor.prototype)
child1.constructor("John");
console.log(child1._name); // Q: what is this?

// 'new' is a shortcut for going Object.create(Parent.prototype)
child2 = new ParentConstructor("Jill");
console.log(child2._name); // Q: what is this?

// if we want children to have more functions we can either do it in the 
// constructor or just add them straight to the prototype - remember
// Parent.prototype is the real parent. 

// so in the constructor (where 'this' is the prototype):
function ParentConstructor(firstName, lastName){
  this._firstName = firstName;
  this._lastName = lastName;
  this.fullName = function(){
    return this._firstName + " " + this._lastName;
  }
}

child = new ParentConstructor("Matthew", "Platts")
console.log(child.fullName()); // What is this?

// or on the prototype directly
function ParentConstructor(firstName, lastName){
  this._firstName = firstName;
  this._lastName = lastName;
}

ParentConstructor.prototype.fullName = function(){
  return this._firstName + " " + this._lastName;
}

child = new ParentConstructor("Matthew", "Platts")
console.log(child.fullName()); // What is this?