Skip to content

Instantly share code, notes, and snippets.

@gaearon
Created May 27, 2020 17:38
Show Gist options
  • Save gaearon/a25fd42a1e6b4cc24851978df0a36571 to your computer and use it in GitHub Desktop.
Save gaearon/a25fd42a1e6b4cc24851978df0a36571 to your computer and use it in GitHub Desktop.
Beneath Classes: Prototypes
class Spiderman {
lookOut() {
alert('My Spider-Sense is tingling.');
}
}
let miles = new Spiderman();
miles.lookOut();
// class Spiderman {
let SpidermanPrototype = {
lookOut() {
alert('My Spider-Sense is tingling.');
}
};
// let miles = new Spiderman();
let miles = { __proto__: SpidermanPrototype };
miles.lookOut();
@khoanguyen-yang
Copy link

Hi @gaearon,

I am wondering why, when defining classes, the properties are on the object itself while the methods are on the __proto__

class Spiderman {
  aProperty;
  lookOut() {
    alert("My Spider-Sense is tingling.");
  }
}

let miles = new Spiderman();
console.log(miles.hasOwnProperty("aProperty")); // true
console.log(Object.getPrototypeOf(miles).hasOwnProperty("lookOut")); // true

@buza-me
Copy link

buza-me commented Jun 14, 2023

image

This is picked up from the Typescript playground. I just finished the Just Javascript module written by Dan and I have a question which might be a noob one but isn't Spiderman.prototype.lookOut = (..) regarded as polluting the prototype and should be discouraged?

const someObject = {};
const everyObjectProto = someObject.__proto__;
const someFunction = function() {};
someFunction.prototype.__proto__ === everyObjectProto; // true

So "someFunction.prototype" points to an object, just like any other in your code, not to the "main" object prototype. Thus it is not polluting anything.

@magnusram05
Copy link

image This is picked up from the Typescript playground. I just finished the Just Javascript module written by Dan and I have a question which might be a noob one but isn't `Spiderman.prototype.lookOut = (..)` regarded as polluting the prototype and should be discouraged?

const someObject = {}; const everyObjectProto = someObject.proto; const someFunction = function() {}; someFunction.prototype.proto === everyObjectProto; // true

So "someFunction.prototype" points to an object, just like any other in your code, not to the "main" object prototype. Thus it is not polluting anything.

This someFunction.prototype.__proto__ === everyObjectProto; // true can be changed to someFunction.prototype === everyObjectProto; // false for clarity

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