Summary

In this chapter, you learned quite a few ways (patterns) of implementing inheritance, and the following table summarizes them. The different types can roughly be divided into the following:

  • Patterns that work with constructors
  • Patterns that work with objects

You can also classify the patterns based on whether they:

  • Use the prototype
  • Copy properties
  • Do both (copy properties of the prototype):

#

Name

Example

Classification

Notes

1

Prototype chaining

(pseudo-classical)

 

Child.prototype = new Parent();

  • Works with constructors
  • Uses the prototype chain

  • The default mechanism
  • Tip - move all properties/methods that are meant to be reused to the prototype, and add the non-reusable as own properties

2

Inherit only the prototype

 

Child.prototype = Parent.prototype;

  • Works with constructors
  • Copies the prototype (no prototype chain, as all share the same prototype object)

  • More efficient; no new instances are created just for the sake of inheritance
  • Prototype chain lookup during runtime; it is fast, since there's no chain
  • Drawback: children can modify parents' functionality

3

Temporary constructor

 

function extend(Child, Parent) {   
 var F = function(){};   
 F.prototype = Parent.prototype;   
Child.prototype = new F();   
Child.prototype.constructor = Child;   
Child.uber = Parent.prototype;   
}

  • Works with constructors
  • Uses the prototype chain

  • Unlike #1, it only inherits properties of the prototype; own properties (created with this inside the constructor) are not inherited.
  • Provides convenient access to the parent (through uber)

4

Copying the prototype properties

 

function extend2(Child, Parent) {   
var p = Parent.prototype;   
var c = Child.prototype;   
 for (var i in p) {   
 c[i] = p[i];   
 }   
c.uber = p;   
}

  • Works with constructors
  • Copies properties
  • Uses the prototype chain

  • All properties of the parent prototype become properties of the child prototype
  • No need to create a new object only for inheritance purposes
  • Shorter prototype chains

5

Copy all properties

(shallow copy)

 

function extendCopy(p) {   
var c = {};    
 for (var i in p) {   
 c[i] = p[i];   
 }   
c.uber = p;   
 return c;   
}

  • Works with objects
  • Copies properties

  • Simple
  • Doesn't use prototypes

6

Deep copy

Same as the previous one, but recurse into objects

  • Works with objects
  • Copies properties

  • Same as #5, but clones objects and arrays

7

Prototypal inheritance

 

function object(o){   
 function F() {}   
F.prototype = o;   
 return new F();   
}

  • Works with objects
  • Uses the prototype chain

  • No pseudo-classes, objects inherit from objects
  • Leverages the benefits of the prototype

8

Extend and augment

 

function objectPlus(o, stuff) {   
var n;   
 function F() {}   
F.prototype = o;   
 n = new F();   
n.uber = o;   
 for (var i in stuff) {   
 n[i] = stuff[i];   
 }   
 return n;   
}

  • Works with objects
  • Uses the prototype chain
  • Copies properties

  • Mix of prototypal inheritance (#7) and copying properties (#5)
  • One function call to inherit and extend at the same time

9

Multiple inheritance

 

function multi() {   
var n = {}, stuff, j = 0,   
len = arguments.length;   
 for (j = 0; j <len; j++) {   
 stuff = arguments[j];   
 for (var i in stuff) {   
 n[i] = stuff[i];   
 }   
 }   
 return n;   
}

  • Works with objects
  • Copies properties

  • A mixin-style implementation
  • Copies all the properties of all the parent objects in the order of appearance

10

Parasitic inheritance

 

function parasite(victim) {   
var that = object(victim);   
that.more = 1;   
 return that;   
}

  • Works with objects
  • Uses the prototype chain

  • Constructor-like function creates objects
  • Copies an object, and augments and returns the copy

11

Borrowing constructors

 

function Child() {   
Parent.apply(this, arguments);   
}

  • Works with constructors

  • Inherits only own properties
  • Can be combined with #1 to inherit the prototype too
  • Convenient way to deal with the issues when a child inherits a property that is an object (and therefore, passed by reference)

12

Borrow a constructor and copy the prototype

 

function Child() {   
Parent.apply(this, arguments);   
}   
   
extend2(Child, Parent);

  • Works with constructors
  • Uses the prototype chain
  • Copies properties

  • Combination of #11 and #4
  • Allows you to inherit both own properties and prototype properties without calling the parent constructor twice

Given so many options, you must be wondering which is the right one. That depends on your style and preferences, your project, task, and team. Are you more comfortable thinking in terms of classes? Then pick one of the methods that work with constructors. Are you going to need just one or a few instances of your class? Then choose an object-based pattern.

Are these the only ways of implementing inheritance? No. You can choose a pattern from the preceding table, you can mix them, or you can think of your own. The important thing is to understand and be comfortable with objects, prototypes, and constructors; the rest is just pure joy.

..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
18.225.35.81