What Are the Methods of Inheritance in JavaScript?

In JavaScript, inheritance is a mechanism enabling a subclass to inherit properties and methods from a parent class. The following are several methods to implement inheritance in JavaScript:

1. Prototype Chain Inheritance

Prototype chain inheritance sets the child's prototype to an instance of the parent class, thereby achieving inheritance.

javascript
function Parent() {
  this.parentProperty = true;
}

Parent.prototype.getParentProperty = function() {
  return this.parentProperty;
};

function Child() {
  this.childProperty = false;
}

// Inherit from Parent
Child.prototype = new Parent();

var child = new Child();
console.log(child.getParentProperty()); // true

2. Constructor Function Inheritance

Constructor function inheritance achieves inheritance by calling the parent constructor within the child constructor using .call() or .apply() to bind the child's this to the parent's context.

javascript
function Parent(name) {
  this.name = name;
}

function Child(name) {
  Parent.call(this, name);
}

var child = new Child('Alice');
console.log(child.name); // Alice

3. Combination Inheritance (Prototype Chain + Constructor Function Inheritance)

Combination inheritance combines the advantages of prototype chain inheritance and constructor function inheritance. Specifically, the child's prototype is set to an instance of the parent class, and the parent constructor is used to enhance child instances.

javascript
function Parent(name) {
  this.name = name;
  this.colors = ['red', 'blue', 'green'];
}

Parent.prototype.sayName = function() {
  console.log(this.name);
};

function Child(name, age) {
  Parent.call(this, name);
  this.age = age;
}

Child.prototype = new Parent();
Child.prototype.constructor = Child;

Child.prototype.sayAge = function() {
  console.log(this.age);
};

var child1 = new Child('Alice', 10);
child1.colors.push('yellow');
console.log(child1.name); // Alice
console.log(child1.age); // 10
console.log(child1.colors); // ['red', 'blue', 'green', 'yellow']

4. Prototypal Inheritance

Prototypal inheritance creates a new object based on an existing object using the Object.create method.

javascript
var parent = {
  name: "Bob",
  getName: function() {
    return this.name;
  }
};

var child = Object.create(parent);
child.name = "Alice";
console.log(child.getName()); // Alice

5. Parasitic Inheritance

Parasitic inheritance creates a function that encapsulates the inheritance process, enhancing the object in a specific way before returning it.

javascript
function createAnother(original) {
  var clone = Object.create(original);
  clone.sayHi = function() {
    console.log('Hi');
  };
  return clone;
}

var person = {
  name: 'Bob',
  getName: function() {
    return this.name;
  }
};

var anotherPerson = createAnother(person);
anotherPerson.sayHi(); // Hi

6. Parasitic Combination Inheritance

Parasitic combination inheritance uses parasitic inheritance to inherit the parent's prototype and assigns the result to the child's prototype.

javascript
function inheritPrototype(childObj, parentObj) {
  var prototype = Object.create(parentObj.prototype);
  prototype.constructor = childObj;
  childObj.prototype = prototype;
}

function Parent(name) {
  this.name = name;
}

Parent.prototype.sayName = function() {
  console.log(this.name);
};

function Child(name, age) {
  Parent.call(this, name);
  this.age = age;
}

inheritPrototype(Child, Parent);

Child.prototype.sayAge = function() {
  console.log(this.age);
};

var child = new Child('Alice', 10);
child.sayName(); // Alice
child.sayAge(); // 10