4

We can override the function's prototype,but not rewrite the prototype of the class?

    function A() {
    }

    class B {
    }

    let _APrototype   = A.prototype;
    let _BPrototype = B.prototype;

    A.prototype = function () {
    };
    B.prototype = function () {
    };

    console.log(_APrototype == A.prototype); //false
    console.log(_BPrototype == B.prototype); //true
heyden
  • 179
  • 1
  • 9
  • Because overwriting the `.prototype` of a class destroys its inheritance hierarchy, so it's forbidden. [Amend the object](https://stackoverflow.com/questions/17474390/defining-a-javascript-prototype) instead. – Bergi Oct 23 '22 at 15:50

2 Answers2

1

It's because you're not actually setting the value for B.prototype. You can't set Object.prototype. For Function.prototype, there is nothing stopping you from overriding the value. Notice how I can change the Function.prototype to a string whereas I can't for the class.

function A() {
}

class B {
}

let _APrototype   = A.prototype;
let _BPrototype = B.prototype;
console.log(A.prototype);
console.log(B.prototype);

A.prototype = "test A";
B.prototype = "test B";
console.log(A.prototype); // Should have been set.
console.log(B.prototype); // Did not actually set.
    
A.prototype = function () {
};
B.prototype = function () {
};

console.log(A.prototype); // Should have been set.
console.log(B.prototype); // Did not actually set.
    
console.log(_APrototype == A.prototype); //false
console.log(_BPrototype == B.prototype); //true

Note you can still add functions to the class's prototype. You just can't change it. This is likely due to holding the base object functions for the class. If you override this then you will lose all the inherited base object functions.

class B {
}

console.log(B.prototype.someMethod1); // Shouldn't exist.
console.log(B.prototype.someMethod2); // Shouldn't exist.
console.log(B.prototype.hasOwnProperty); // Inherited.

B.prototype.someMethod1 = function someMethod1() {
};
console.log(B.prototype.someMethod1); // Should now exist.
console.log(B.prototype.someMethod2); // Still doesn't exist.
console.log(B.prototype.hasOwnProperty); // Inherited.

// This can work depending on which JS features are supported.
B.prototype = {
  someMethod2: function() {
    
  }
}

console.log(B.prototype.someMethod1); // Should be removed now.
console.log(B.prototype.someMethod2); // Should now exist.
console.log(B.prototype.hasOwnProperty); // Inherited even though we completely overwrote the previous set of methods.
0

The same question also came to mind and finally, I found out why we can not override the prototype of the class, here is my answer:

See, prototype is a property of function /class which is an object, and if you examine the prototype object with Object.getOwnPropertyDescriptor(<your_class_or_function_name>,'prototype') ,in case of class you will find that "writable:false" but in case function "writable: true"

find below the code snippet : In Case of Class

class myclass {
 constructor(name) {
   this.name = name;
   }
 getName() {
  console.log(this.name);
 }
}
console.log(Object.getOwnPropertyDescriptor(myclass, "prototype"));

Output:

enter image description here

In Case of function:

function MyFunction(name) {
 this.name = name;
 }
 console.log(Object.getOwnPropertyDescriptor(MyFunction, "prototype"));

Output:

enter image description here

Hope you got the answer

shiblee saidul
  • 111
  • 1
  • 2
  • 10