JavaScript继承

JavaScript的继承分为7种

1. 原型继承

2. 借用继承

3. 组合继承

4. 拷贝继承

5. 组合继承2

6. 寄生继承

7. 寄生式组合继承

下面是各个继承的详细解释

1. 原型继承

核心：让子类的原型指向父类的实例(子类.prototype = new 父类())

优点：能够继承父类的属性和方法

缺点：1. 子类不能有自己的私有方法，也就是没有自己的原型

           2. 继承下来的属性是一模一样的

原型继承代码实现 ：

        此时子类的原型上就有父类的属性和方法

function Person(name,age){
    this.name = name;
    this.age = age
}
Person.prototype.sayHi = function () { console.log('Hi') }

function Student(gender){
    this.gender = gender;
}
Student.prototype = new Person('zs',18)

 2. 借用继承

核心：利用call调用父类构造函数，改变父类构造函数的this指向(父类.call(this))

优点：1. 子类能够有属于自己的独立的私有属性

           2. 有自己的原型

缺点：子类不能继承父类的方法

借用继承代码实现：

function Person(name,age){
    this.name = name;
    this.age = age;
}
Person.prototype.sayHi = function () {console.log('Hi')}

function Student(gender,name,age){
    Person.call(this,name,age)
    this.gender = gender;
}
Student.prototype.sayHello = function () {console.log('Hello')}

 

3. 组合继承

核心：原型继承 + 借用继承

优点：1. 能够继承父类的属性和方法

           2. 每个继承下来的属性都是自己独立的私有属性

缺点：1. 还是没有自己的原型

           2. 多余一套没有用的属性

组合继承的实现 :

function Person(name,age){
    this.name = name;
    this.age = age;
}
Person.prototype.sayHi = function () {consloe.log('Hi')}

function Student(gender,name,age){
    Person.call(this,name,age);
    this.gender = gender;
}
Student.prototype = new Person()

 4. 拷贝继承

核心：将父类的实例上面的东西遍历一遍到子类的原型上

优点：1. 可以继承到父类的属性和方法

           2. 有自己的原型，可以添加自己的私有方法

缺点：需要时间

拷贝继承的实现 :

function Person(name,age){
    this.name = name;
    this.age = age;
}
Person.prototype.sayHi = function () {console.log('Hi')}

function Student(gender){
    this.gender = gender;
}
const p = new Person('zs',18);
for(let k in p){
    Student.prototype[k] = p[k];
}

 

5. 组合继承2

核心：借用继承 + 拷贝继承的一部分

优点：1. 子类继承下来的属性是独立的私有属性

           2. 有自己的原型，可以添加属于自己的私有方法

           3. 能继承父类的属性和方法

缺点：和拷贝继承一样，需要时间 

组合继承2的代码实现 

function Person(name,age){
    this.name = name;
    this.age = age;
}
Person.prototype.sayHi = function () {console.log('Hi')}

function Student(gender,name,age){
    Person.call(this,name,age);
    this.gender = gender;
}
for(let k in Person.prototype){
    Student.prototype[k] = Person.prototype[k];
}

 6. 寄生继承

核心：利用中间构造函数实现对父类的寄生

优点：有属于自己的原型

缺点：1. 不能继承父类的属性

           2. 多一个中间构造函数的变量名

寄生继承的实现 

function Person(name,age){
    this.name = name;
    this.age = age;
}
Person.prototype.sayHi = function () {console.log('Hi')}

function Student(gender){
    this.gender = gender;
}

function Third(){}
Third.prototype = Person.prototype;
Student.prototype = new Third();

 7. 寄生式组合继承

核心： 借用继承 + 寄生继承

优点：1. 能够继承父类的属性和方法

           2. 继承下来的属性是自己的私有属性

           3. 有自己的原型，可以添加自己的私有方法

寄生式组合继承的实现 

function Person(name,age){
    this.name = name;
    this.age = age;
}
Person.prototype.sayHi = function () {console.log('Hi')}

function Student(gender,name,age){
    Person.call(this,name,age);
    this.gender = gender;
}

(function (){
    function Third();
    Third.prototype = Person.prototype;
    Student.prototype = new Third();
    Student.prototype.constructor = Student;
})()

 

ES6的继承语法：

class Person{...}

class Student extends Person{

        constructor(){

                super()

        }

}