Hacker News new | ask | show | jobs
by kenbellows 2881 days ago
Can you rephrase? The "prototype chain" refers to the whole sequence of objects that link to each other by the `__proto__` property, e.g.:

    let vertebrate = {hasSpine: true},
        mammal = {hasHair: true},
        dog = {sound: 'bark'};
        sparky = {name: 'Sparky'},
        jumbo = {name: 'Jumbo'};
    
    mammal.__proto__ = vertebrate;
    dog.__proto__ = mammal;
    sparky.__proto__ = dog;
    jumbo.__proto__ = dog;
    
    console.log(sparky.hasSpine); // true
    console.log(jumbo.hasHair);   // true
    console.log(sparky.sound);    // 'bark'
    console.log(jumbo.name);      // 'Jumbo'
When you access `sparky.hasSpine`, the JS engine first checks whether `sparky` has an "own property" called `hasSpine`. It doesn't, so it checks `sparky.__proto__.hasSpine`, which is the same as `dog.hasSpine`. No luck, so it checks `sparky.__proto__.__proto__.hasSpine` (i.e. `mammal.hasSpine`), and finally `sparky.__proto__.__proto__.__proto__.hasSpine` (i.e. `vertebrate.hasSpine`), which resolves to `true`.

This entire structure of objects linked through their `__proto__` property is what we call the "prototype chain". Does that answer your question?

1 comments

To clarify I meant this example:

  var cons = function () {
     this.a = 1;
     this.b = 2;
  }
  var obj = new cons(); 
 
  cons.prototype.b = 3;
  cons.prototype.c = 4;
Was just confused as it seems to be applying class concepts to a function.
Ah, I see. The special thing here is the `new` keyword. When an object is created using `new myconstructor()`, the following steps occur (among others):

  1. create a new empty object; call it `newObj`
  2. call the constructor using `newObj` as its `this` context, so that `this.a = 1` is effectively `newObj.a = 1`
  3. if the constructor has a `prototype` property defined, invoke `newObj.__proto__ = myconstructor.prototype` to establish the prototype chain on the new object
The critical distinction here is between `constructor.prototype` and `object.__proto__`. For exactly this reason, it bothers me a bit that the article uses `Prototype`, with a capital "P", to mean "the thing that `object.__proto__` points to". This is completely different from the `prototype` (small "p") property of a constructor, which is essentially just a holding place for the `__proto__` property of any objects created by calling this constructor with the `new` keyword.

Hopefully that all made sense!

Note that constructorFunction.prototype predates __proto__ in the official specs (and also `class` notation) and is the oldest bit of object-oriented programming support in JS.

__proto__ on objects was originally a leaky abstraction in a specific browser. It caught on such that other browsers borrowed it, because they unfortunately had to, but the specs and the browsers all consider it deprecated and warn not to use it: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Refe...

(The standards compliant way to get an object's prototype at runtime is Object.getPrototypeOf(obj), and to change an object's prototype instance at runtime is Object.setPrototypeOf(obj, newPrototype).)

Very good points. And thanks for the note about Object.getPrototypeOf(obj) and Object.setPrototypeOf(obj, newPrototype), I don't think I had ever actually looked that up!
Yes it did. Thank you!