What is combined inheritance in JS? Introduction to js combination inheritance

Combination Inheritance

Combination Inheritance, sometimes also called pseudo-classical inheritance, refers to: combining the prototype chain and An inheritance pattern that borrows the techniques of constructors and combines them together to take advantage of the best of both worlds.

Implementation idea: Use the prototype chain to realize the inheritance of prototype methods and methods, and borrow the constructor to realize the inheritance of instance attributes.

In this way, function reuse is achieved by defining methods on the prototype, and it is also ensured that each instance object has its own attributes.

function SuperType(name){
    this.name = name;
    this.colors = ["red","green","blue"];
}

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

function SubType(name, age) {
    
    //继承属性
    SuperType.call(this, name);

    this.age = age;
}

//继承方法
SubType.prototype = new SuperType();
SubType.prototype.constructor = SubType();
SubType.prototype.sayAge = function(){
    console.log(this.age);
}

var instance1 = new SubType("Shaw", 18);
instance1.colors.push("black");
console.log(instance1.colors); //["red","green","blue","black"]
instance1.sayName(); // "Shaw"
instance1.sayAge(); // 18

var instance2 = new SubType("Roc", 19);
console.log(instance2.colors); // ["red", "green", "blue"]
instance2.sayName(); // "Roc"
instance2.sayAge(); // 19

In the above code, the SuperType constructor defines two attributes: name and colors.

A sayName() method is defined on the prototype of SuperType.

The SubType constructor passes in the name parameter when calling the SuperType constructor, and then defines its own attribute age.

Then, assign the SuperType instance object to the SubType prototype, and then define the sayAge() method on the new prototype.

In this way, two different SubType instance objects not only have their own properties - including the colors property, but also can use the same method.

Composition avoids the shortcomings of the prototype chain and borrowed constructors and combines their advantages. Becoming the most commonly used inheritance pattern in JavaScript. Furthermore, the operators instanceof and isPrototypeOf() methods can also be used to identify objects created based on compositional inheritance.

The above is the detailed content of What is combined inheritance in JS? Introduction to js combination inheritance. For more information, please follow other related articles on the PHP Chinese website!