Prototype chain inheritance

Implementation: Subclass prototype assigns instance to its parent class.

function Parent() {
    this.names = ['kevin'.'daisy'];
}

function Child() {}
// subclass prototype assigns instance to its parent class.
Child.prototype = new Parent();
Prototype. constructor = subclass
Child.prototype.constructor = Child
Copy the code

Disadvantages:

• All subclass instances share modifiable stereotype attributes.
• A subclassnewCannot pass arguments to the parent constructor when.
• I want to change it manuallyprototype.constructorFor the subclass.

let a = new Child();

a.names.push('yayu');

console.log(a.names); // ["kevin", "daisy", "yayu"]

let b = new Child();

console.log(b.names); // ["kevin", "daisy", "yayu"]
Copy the code

Borrowing constructors (classical inheritance)

Implementation: A subclass calls the parent class constructor.

function Parent() {
    this.names = ['1'.'2'];
    this.getNames = () = > this.names;
}

Parent.prototype.protoGetNames = function () {}

function Child() {
    // Subclasses call the parent constructor.
    Parent.call(this);
}
Copy the code

Advantages:

• Attributes are defined inthis, avoid sharing.
• You can pass parameters to the parent constructor.

Disadvantages:

• Parent method, cannot passprototypeAccess.
• Methods must be defined in the parent constructor and are created every time an instance is created.

// a
let a = new Child();

a.names.push('3');

console.log(a.names); / / / "1", "2", "3"]
// b
let b = new Child();

console.log(b.names); / / / "1", "2"
// Methods are defined in constructors
console.log(a.getNames()) // ['1', '2', '3']
// The method is created every time an instance is created.
console.log(a.getNames === b.getNames) // false
// Cannot access the parent prototype method
console.log(a.protoGetNames)// undefined
Copy the code

Combination of inheritance

Implementation: prototype chain inheritance + constructor inheritance

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

Parent.prototype.getName = function () {
    return this.name
}

function Child(name, age) {
    // Constructor inheritance
    Parent.call(this, name);
    this.age = age;
}
// Prototype inheritance
// The superclass constructor is called repeatedly, and the prototype has superclass properties and methods
Child.prototype = new Parent();
Child.prototype.constructor = Child;
Copy the code

Advantages: Combining the advantages of stereotype chain inheritance and constructors is the most common inheritance pattern in JavaScript. Disadvantages:

• Call the constructor twice.
• The stereotype has superclass properties and methods.

Parasitic inheritance (object enhancement)

Implementation: a specific encapsulating inherited object, enhanced object, similar to inheritance.

// Focus on objects, not types and constructor scenarios. - the little red book
function createDog(obj){
    The object() function is not required for parasitic inheritance, and any function that returns a new object can be used here. - the little red book
    let clone = object(obj);
    clone.getColor = function(){
        console.log(clone.color)
    }
    return clone
}

// Parasitical inheritance is simply instantiating a temporary copy of the same prototype chain without instantiating the parent class.
function object(proto) {
    function F() {}
    F.prototype = proto;
    return new F();
}
Copy the code

Advantages: No constructor is called. Disadvantages:

• Specific encapsulation, unable to reuse.

let dog = {
    color: 'yellow'
}

let dog1 = createDog(dog);
dog1.getColor();  // yellow
Copy the code

Parasitic combinatorial inheritance

Implementation: parasitic + combination

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

Parent.prototype.getName = function () {
  return this.name
}

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

// Parasitic combination inheritance
function extend(Child, Parent) {
  var F = function () {};
  F.prototype = Parent.prototype;
  Child.prototype = new F();
  / / correct constructor
  Child.prototype.constructor = Child
}

extend(Child, Parent)
Copy the code

Advantages: Almost perfect implementation of inheritance, fixed the prototype bug of composite inheritance.

• Attributes are defined inthis, avoid sharing.
• You can pass arguments to a parent class.
• The constructor is called only once, and the stereotype has no redundant attributes.
• construcotCorrect.