The Prototype Chain

The Prototype Chain

Prerequisites: you should already be comfortable with objects, property access, functions, and this binding from earlier chapters. We assume you know that typeof [] === 'object' and that functions are callable objects.

JavaScript uses prototypal inheritance: objects delegate to other objects. Every object has an internal link, [[Prototype]], to another object (or null). When you read a property, the engine walks this chain until it finds the property or reaches null. Writes and own-property creation do not walk the chain — assigning creates or updates a property on the receiver only.

class Greeter {
  greet(name) { return `Hello, ${name}!`; }
}
const g = new Greeter();
console.log(g.greet('Ada')); // Hello, Ada!
console.log(Object.getPrototypeOf(g) === Greeter.prototype); // true

The class syntax is sugar over the same mechanism: g has no own greet; the lookup finds it on Greeter.prototype.

const base = { describe() { return `I have ${Object.keys(this).length} keys`; } };
const derived = Object.create(base);
derived.extra = true;
console.log(derived.describe()); // methods on `base` run with `this` = derived

Internal details and gotchas

• __proto__ vs prototype. __proto__ (now standardized via Object.prototype) is the accessor for an instance's [[Prototype]]. prototype is a property of functions: the object that new F() will delegate to. Confusing these is the classic error.
• super is statically bound. super.foo uses the home object's [[Prototype]], captured at method definition time — unlike this, it cannot be changed by call or bind.
• Shadowing and mutation propagate. Overwriting derived.describe shadows base.describe. Conversely, mutating a shared prototype object affects every delegating instance instantly — useful, and a footgun with built-ins.
• Extending built-ins is brittle. class MyArray extends Array historically broke across realms and with methods like .map returning plain arrays; composition (wrapping) is often safer.
• Object.create(null) makes a prototype-less dictionary: no inherited keys to collide with user data, but also no hasOwnProperty — use Object.hasOwn(obj, key) instead.
• Setting prototypes after creation via Object.setPrototypeOf deoptimizes: the engine invalidates inline caches for every access through that object. Prefer Object.create(proto).

Prototype chain vs. classes

Decision criteria

Use plain prototype delegation (Object.create) for small object hierarchies and shared behavior without ceremony. Use class when you want instanceof checks, constructor semantics, and super calls — and when interop with the platform matters. Avoid deep chains (more than 3–4 levels): lookup cost grows and failure modes become hard to trace.