继承

112 阅读1分钟

1、继承的含义

继承,子类通过“继承”这种方式,可以使子类在不声明父类的属性和方法的情况下使用父类的属性和方法。

2、继承的实现

2.1、es6的实现方式

class People {
    constructor(name,sex){
        this.name = name;
        this.sex = sex;
    }
    getName(){
        return this.name;
    }
    getSex(){
        return this.sex;
    }
    print(){
        console.log(this.name,this.sex);
    }
}    

class Work extends People{
    constructor(name,sex,job){
        super(name,sex);
        this.job = job;
    }
    getJob(){
        return this.job;
    }
}

let man = new Work('xhp','male',24);

console.log(Object.getPrototypeOf(Work.prototype) === People.prototype)             // true
console.log(Object.getPrototypeOf(Object.getPrototypeOf(man)) === People.prototype) // true
console.log(man instanceof  People )// true

2.2、es5的实现方式(寄生组合)

思路

一、子类构造函数通过apply的方式调用父类,声明成员变量。

二、声明继承函数,内容如下

1.子原型指向父原型的原型链
2.修复constructor
3.声明超类
4.将父函数的静态方法赋值给子函数的静态方法

实现源码

function Faher(array){
    this.array = array;
}
Faher.getName = function() {

}
Faher.prototype.a = function(){
    console.log('a');
}

function Son(array,name) {
    Faher.call(this,array);
    this.name = name;
}

/*
1.子原型指向父原型的原型链
2.修复constructor
3.声明超类
4.将父函数的静态方法赋值给子函数的静态方法
*/
function extendObj(fn_Son,fn_Father) {
    fn_Son.prototype = Object.create(fn_Father.prototype);
    fn_Son.prototype.constructor = fn_Son;
    fn_Son.super = fn_Father;

    // 兼容IE
    if (Object.setPrototypeOf) {
        Object.setPrototypeOf(fn_Son,fn_Father);
    } else if (fn_Son.__proto__) {
        fn_Son.__proto__ = fn_Father;
    } else {
        for (var k in fn_Father) {
            if (fn_Father.hasOwnProperty(k) && !(k in fn_Son)) {
                fn_Son[k] = fn_Father[k];
            }
        }
    }
    
}

extendObj(Son,Faher);

Son.prototype.b = function(){
    console.log('b');
}

let obj = new Son([1,2,3],'xhp');
console.log(obj)