Andrey Bushman
Andrey Bushman

Reputation: 12476

Why the prototype of instance is not the same like the prototype of its constructor if to use the `Object.getPrototypeOf()` function?

Why the prototype of instance is not the same like the prototype of its constructor if to use the Object.getPrototypeOf() function?

function A(n){this.n=n;};

let a = new A(1);

console.log('Object.getPrototypeOf(a) == Object.getPrototypeOf(A); // ', 
	Object.getPrototypeOf(a) == Object.getPrototypeOf(A));

console.log('Object.getPrototypeOf(a) == A.prototype; // ', 
	Object.getPrototypeOf(a) == A.prototype);

Upvotes: 0

Views: 28

Answers (3)

amt8u
amt8u

Reputation: 29

Although it seems simple at a glance but the answer will become more clear if you know how protoypal inheritance works in JS.

Still I would try to explain it in short, how prototype works.

In JS, everything is an object. Although primitive values such as numbers, strings, boolean do not look like objects but are treated like objects internally.

For a quick reference see below. Everything is an object. enter image description here

Now lets come to the case mentioned in question. Whenever you create anything in JS, it uses some existing prototype. It depends on what kind of item you are creating.

The below line is basically doing a lot of things in background. It is creating a function with name as 'A'. While doing so the JS engine uses an already existing special object in the browser called Function.prototype. This contains the basic characteristics of any function that you are creating. Then it creates a brand new object that has only two properties by default: constructor and a link to the default object prototype(referenced by proto). And then assign the new function definition that you have written to this newly created function.

function A(n){this.n=n;};

Hence we have two prototypes to understand here:

  • Function.prototype
  • A.prototype

Function.prototype would give that existing object we discussed above which is provided by the engine to create new functions.

A.prototype is the new object that gets created when A is declared. Note that we haven't yet used our new function A to create objects.

While running the below code, JS engine creates a new object which would inherit properties from A.prototype, runs the function definition which is stored in A(this.n = n etc..) and returns the newly created object.

let a = new A(1);

To summarize

  • a is an object that inherits from A.prototype
  • A is a function(a special object) that inherits from Function.prototype

I think now it should be clear what the below code means.

Object.getPrototypeOf(a) === A.prototype // true
Object.getPrototypeOf(A) === Function.prototype //true

Upvotes: 0

JLRishe
JLRishe

Reputation: 101662

You are seeing this because A's prototype (the prototype object from which A is derived) is Function.prototype, not A.prototype:

function A(n){this.n=n;};

console.log('Object.getPrototypeOf(A) === Function.prototype');
console.log(Object.getPrototypeOf(A) === Function.prototype);

let a = new A(1);

console.log('Object.getPrototypeOf(a) === A.prototype');
console.log(Object.getPrototypeOf(a) === A.prototype);

Object.getPrototypeOf(x) is not just a convoluted way of writing x.prototype.

Object.getPrototypeOf(x) returns the prototype from which x is derived.
x.prototype is the prototype of objects created using x as a constructor.

Upvotes: 1

Michał Perłakowski
Michał Perłakowski

Reputation: 92501

Object.getPrototypeOf() returns the value of the internal [[Prototype]] property, which is not the same as the prototype property. When you create a function (or a class), it gets a prototype property, and when you create an instance of it, the created object has the internal [[Prototype]] property set to the prototype property of the class.

Your first example evaluates to false, because [[Prototype]] of a is A.prototype, but [[Prototype]] of A is Function.prototype, because every function is an instance of the Function class.

Upvotes: 2

Related Questions