How to create a class that does not inherit from Object.prototype using ES6 classes?

Question

I can create a class that does not inherit from Object.prototype using the old syntax.

 function Shape(x, y, width, height) { this.x = x, this.y = y, this.width = width, this.height = height; } Shape.prototype = Object.create(null, { constructor: { configurable: true, writable: true, value: Shape }, move: { configurable: true, writable: true, value: function (x, y) { this.x += x, this.y += y; } } }); var rect = new Shape(0, 0, 4, 2); console.log(Object.getPrototypeOf(rect) === Shape.prototype); console.log(Object.getPrototypeOf(Object.getPrototypeOf(rect)) !== Object.prototype); //inheritance 

How to do this using ES6 classes?

 class Shape { constructor(x, y, width, height) { this.x = x, this.y = y, this.width = width, this.height = height; } move(x, y) { this.x += x, this.y += y; } } var rect = new Shape(0, 0, 4, 2); console.log(Object.getPrototypeOf(rect) === Shape.prototype); console.log(Object.getPrototypeOf(Object.getPrototypeOf(rect)) === Object.prototype); // inheritance 

Answer 1

You can use extends null .

Note that the class itself will still inherit from Function.prototype , not null . This way you can use function methods in the class.

But keep in mind that when using the extends clause, you must either initialize this before using it by calling super , or do not use this and return the object to the end.

In this case, you cannot initialize this with super , because Function.prototype not a constructor. Therefore, you will need to use Object.create to create an object that becomes an instance.

 class Shape extends null { constructor(x, y) { // Use `that` instead of `this`, and return it at the end var that = Object.create(new.target.prototype); that.x = x; that.y = y; return that; } move(x, y) { this.x += x; this.y += y; } } var rect = new Shape(0, 0); console.log(rect); console.log(Object.getPrototypeOf(rect) === Shape.prototype); console.log(Object.getPrototypeOf(Shape.prototype) === null); console.log(Object.getPrototypeOf(Shape) === Function.prototype); 

new.target will be the function that is being created. It may be Shape itself or another function that extends it. This is useful for expandability of Shape .

 class Shape extends null { constructor(x, y) { // Use `that` instead of `this`, and return it at the end var that = Object.create(new.target.prototype); that.x = x; that.y = y; return that; } move(x, y) { this.x += x; this.y += y; } } class BestShape extends Shape { constructor(...args) { super(...args); this.best = true; } } var rect = new BestShape(0, 0); console.log(rect); console.log(Object.getPrototypeOf(rect) === BestShape.prototype); console.log(Object.getPrototypeOf(BestShape.prototype) === Shape.prototype); console.log(Object.getPrototypeOf(Shape.prototype) === null); console.log(Object.getPrototypeOf(BestShape) === Shape); console.log(Object.getPrototypeOf(Shape) === Function.prototype); 

If you do not want to use this in your constructor, the alternative is an extension of the function, prototype is null . The downside is that your class inherits this function, and not directly from Function.prototype .

 function NullClass() {} NullClass.prototype = null; class Shape extends NullClass { constructor(x, y) { super(); this.x = x; this.y = y; } move(x, y) { this.x += x; this.y += y; } } var rect = new Shape(0, 0); console.log(rect); console.log(Object.getPrototypeOf(rect) === Shape.prototype); console.log(Object.getPrototypeOf(Shape.prototype) === null); console.log(Object.getPrototypeOf(Shape) === NullClass); console.log(Object.getPrototypeOf(NullClass) === Function.prototype); 

If you do not want to reuse NullClass , you can define it inline

 class Shape extends Object.assign(function(){},{prototype:null}) { /* ... */ } 

Answer 2

You need to manually set the Shape.prototype prototype to null .

 class Shape { constructor(x, y, width, height) { this.x = x, this.y = y, this.width = width, this.height = height; } move(x, y) { this.x += x, this.y += y; } } // This is the key line. Object.setPrototypeOf(Shape.prototype, null); const rect = new Shape(0, 0, 4, 2); console.log(Object.getPrototypeOf(rect) === Shape.prototype); console.log(Object.getPrototypeOf(Object.getPrototypeOf(rect)) !== Object.prototype);