Skip to content

Instantly share code, notes, and snippets.

@byelipk
Created October 25, 2017 15:27
Show Gist options
  • Save byelipk/e5feccb919676e47f671f8a5ccc1bdb9 to your computer and use it in GitHub Desktop.
Save byelipk/e5feccb919676e47f671f8a5ccc1bdb9 to your computer and use it in GitHub Desktop.

What are the 4 things that happen when we use the new in front of a function call?

  1. It creates a brand new object.
  2. The new object gets linked to the function's prototype.
  3. The new object gets passed into the function call as this.
  4. The function call returns this.

What is a constructor call?

It is a function call with the new keyword in front of it.

What does Object.create do?

It performs the first two actions that using the new keyword does:

  1. It creates a brand new object.
  2. The new object gets linked to another object.

What is [[Prototype]] and where does it comes from?

It's a linkage from one object to another and it's created at the time the object is created. (When an object is created it gets linked somewhere.)

How does [[Prototype]] affect the behavior of an object?

If we call methods or properties on an object and they don't exist, the prototype will attempt to look higher up the prototype chain for the desired behavior.

What are three ways we find out where an object's [[Prototype]] points to?

foo.__proto__ Object.getPrototypeOf foo.constructor.prototype

What is a tradeoff of using Prototypes over the module pattern?

You lose encapsulation because each property and method is public.

Why would we use the prototype pattern?

We love classes, and the prototype pattern seems to be the best way we have in Javascript to emulate classes.

What's a problem of mixing the module pattern and prototypes?

The prototype system and the lexical system do not cross over.

What's the deal with ES6 Classes?

The syntax is beautiful!

But it's just syntactic sugar over the prototype system. They're designed to pretend there is a copy operation going on because that's they way classes work in other languages.

What's an example of the OLOO pattern?

The power of javascript is to be able to create objects, link them together, and delegate between them.

var Foo = {
  init: function(who) {
    this.me = who;
  },
  identify: function() {
    return `I am ${this.me}`; 
  }
};

var Bar = Object.create(Foo);

Bar.speak = function() {
  console.log(`Hello, ${this.identity()}!`);
}

var b1 = Object.create(Bar);
b1.init('Sweet');
b1.speak();

How would you write your own Object.create?

if (!Object.create) {
  Object.create = function(o) {
    return {
      __proto__: o
    };
  };
}

if (!Object.create) {
  Object.create = function(o) {
    function F() {};
    F.prototype = o;
    return new F();
  };
}

What is virtual composition?

It's a pattern where we decide to delegate objects to one another at the call site.

Each piece of code is independent. This makes testing MUCH easier.

Here's an example:

var AuthController = {
  authenticate() {
    server.authenticate(
      [this.username, this.password],
      this.handleResponse.bind(this)
    );
  },
  handleResponse(resp) {
    if (!resp.ok) this.displayError(resp.msg);
  }
};

var LoginFormController = 
  delegateTo(AuthController, {
    onSubmit() {
      this.username = document.querySelector("#username").textContent;
      this.password = document.querySelector("#password").textContent;
      this.authenticate();
    },
    displayError(msg) {
      alert(msg)
    }
  });

function delegateTo(delegate, body) {
  if (body === undefined) body = {};
  return Object.assign(Object.create(delegate), body);
}

How is javascripts [[Prototype]] chain not like traditional/classical inheritance?

The prototype chain provides a live link up the chain instead of copying objects down the chain.

What does [[Prototype]] delegation mean and how does it describe object linking in javascript?

Delegate is peer-to-peer rather than parent-child. We don't inherit behavior, but we collaborate with other objects that can provide the behavior we're looking for.

Delegation allows two objects to share context at call time. (Virtual composition.)

What are the benefits of the "behavior delegation" design pattern?

Since objects are composed together, it is much easier to test objects in isolation.

The code is more explicit.

What are the tradeoffs of the "behavior delegation" design pattern?

We lost encapsulation that we had in the module pattern.

The code can be a little more complex.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment