Prototypal Inheritance https://crockford.com/javascript/prototypal.
html
Prototypal Inheritance in JavaScript
Douglas Crockford
www.crockford.com
Five years ago I wrote Classical Inheritance in JavaScript (Chinese Italian Japanese). It
showed that JavaScript is a class-free, prototypal language, and that it has sufficient
expressive power to simulate a classical system. My programming style has evolved
since then, as any good programmer's should. I have learned to fully embrace
prototypalism, and have liberated myself from the confines of the classical model.
My journey was circuitous because JavaScript itself is conflicted about its prototypal
nature. In a prototypal system, objects inherit from objects. JavaScript, however, lacks
an operator that performs that operation. Instead it has a new operator, such that
new f()
produces a new object that inherits from
f.prototype
This indirection was intended to make the language seem more familiar to classically
trained programmers, but failed to do that, as we can see from the very low opinion
Java programmers have of JavaScript. JavaScript's constructor pattern did not appeal to
the classical crowd. It also obscured JavaScript's true prototypal nature. As a result,
there are very few programmers who know how to use the language effectively.
Fortunately, it is easy to create an operator that implements true prototypal inheritance.
It is a standard feature in my toolkit, and I highly recommend it for yours.
function object(o) {
function F() {}
F.prototype = o;
return new F();
}
The object function untangles JavaScript's constructor pattern, achieving true
prototypal inheritance. It takes an old object as a parameter and returns an empty new
object that inherits from the old one. If we attempt to obtain a member from the new
object, and it lacks that key, then the old object will supply the member. Objects inherit
from objects. What could be more object oriented than that?
So instead of creating classes, you make prototype objects, and then use the object
function to make new instances. Objects are mutable in JavaScript, so we can augment
the new instances, giving them new fields and methods. These can then act as
prototypes for even newer objects. We don't need classes to make lots of similar objects.
For convenience, we can create functions which will call the object function for us,
and provide other customizations such as augmenting the new objects with privileged
functions. I sometimes call these maker functions. If we have a maker function that
calls another maker function instead of calling the object function, then we have a
parasitic inheritance pattern.
I have found that by using these tools, coupled with JavaScript's lambdas and object
quasi-literals, I can write well-structured programs that are large, complex, and
1 of 2 6/19/2020, 8:21 PM
Prototypal Inheritance https://crockford.com/javascript/prototypal.html
efficient. The classical object model is by far the most popular today, but I think that the
prototypal object model is more capable and offers more expressive power.
Learning these new patterns also made me a better classical programmer. Insights from
the dynamic world can have application in the static.
2006-06-07
Here is another formulation:
Object.prototype.begetObject = function () {
function F() {}
F.prototype = this;
return new F();
};
newObject = oldObject.begetObject();
2007-04-02
The problem with the object function is that it is global, and globals are clearly
problematic. The problem with Object.prototype.begetObject is that it trips up
incompetent programs, and it can produce unexpected results when begetObject is
overridden.
So I now prefer this formulation:
if (typeof Object.create !== 'function') {
Object.create = function (o) {
function F() {}
F.prototype = o;
return new F();
};
}
newObject = Object.create(oldObject);
2008-04-07
2 of 2 6/19/2020, 8:21 PM