Object.setPrototypeOf()

obj

The object which is to have its prototype set.

prototype

The object's new prototype (an object or null).

The specified object.

TypeError

Thrown in one of the following cases:

• The obj parameter is undefined or null.
• The obj parameter is non-extensible, or it's an immutable prototype exotic object, such as Object.prototype or window. However, the error is not thrown if the new prototype is the same value as the original prototype of obj.
• The prototype parameter is not an object or null.

Object.setPrototypeOf() is generally considered the proper way to set the prototype of an object. You should always use it in favor of the deprecated Object.prototype.__proto__ accessor.

If the obj parameter is not an object (e.g. number, string, etc.), this method does nothing — without coercing it to an object or attempting to set its prototype — and directly returns obj as a primitive value. If prototype is the same value as the prototype of obj, then obj is directly returned, without causing a TypeError even when obj has immutable prototype.

For security concerns, there are certain built-in objects that are designed to have an immutable prototype. This prevents prototype pollution attacks, especially proxy-related ones. The core language only specifies Object.prototype as an immutable prototype exotic object, whose prototype is always null. In browsers, window and location are two other very common examples.

Object.isExtensible(Object.prototype); // true; you can add more properties
Object.setPrototypeOf(Object.prototype, {}); // TypeError: Immutable prototype object '#<Object>' cannot have their prototype set
Object.setPrototypeOf(Object.prototype, null); // No error; the prototype of `Object.prototype` is already `null`

Inheritance in JS using classes.

class Human {}
class SuperHero extends Human {}

const superMan = new SuperHero();

However, if we want to implement subclasses without using class, we can do the following:

function Human(name, level) {
  this.name = name;
  this.level = level;
}

function SuperHero(name, level) {
  Human.call(this, name, level);
}

Object.setPrototypeOf(SuperHero.prototype, Human.prototype);

// Set the `[[Prototype]]` of `SuperHero.prototype`
// to `Human.prototype`
// To set the prototypal inheritance chain

Human.prototype.speak = function () {
  return `${this.name} says hello.`;
};

SuperHero.prototype.fly = function () {
  return `${this.name} is flying.`;
};

const superMan = new SuperHero("Clark Kent", 1);

console.log(superMan.fly());
console.log(superMan.speak());

The similarity between classical inheritance (with classes) and pseudoclassical inheritance (with constructors' prototype property) as done above is mentioned in Inheritance chains.

Since function constructors' prototype property is writable, you can reassign it to a new object created with Object.create() to achieve the same inheritance chain as well. There are caveats to watch out when using create(), such as remembering to re-add the constructor property.

In the example below, which also uses classes, SuperHero is made to inherit from Human without using extends by using setPrototypeOf() instead.

class Human {}
class SuperHero {}

// Set the instance properties
Object.setPrototypeOf(SuperHero.prototype, Human.prototype);

// Hook up the static properties
Object.setPrototypeOf(SuperHero, Human);

const superMan = new SuperHero();

Subclassing without extends is mentioned in ES-6 subclassing.

• Polyfill of Object.setPrototypeOf in core-js
• Reflect.setPrototypeOf()
• Object.prototype.isPrototypeOf()
• Object.getPrototypeOf()
• Object.prototype.__proto__
• Inheritance chain
• ES6 In Depth: Subclassing on hacks.mozilla.org (2015)