ES5和ES6的继承语法

ES5的面向对象的继承语法

1. 继承属性

通过改变this指向

在子类构造函数中 直接调用父类构造函数（不通过new 关键字）

通过 call / apply 调用父类构造函数

通过 改变父类构造函数 this指向 到子类实例化对象

语法：

funtion F(){}
...
function S(){
    F.call(this,参数....)
}

子类构造函数也可以定义 自己的属性属性值

2.继承函数方法

通过原型链 prototype

函数方法定义 不是直接定义 - 可以通过调用父类构造函数 prototype

给子类构造函数的prototype 赋值 存储 父类构造函数的内存地址

子类实例化对象可以通过__proto__来访问子类构造函数的prototype

赋值之后 子类的prototype 就是父类的实例化对象

子类构造函数prototype的__proto__ 就是父类实例化对象的 __proto__

举个例子：

//定义父类构造函数

function Father( name , age ){
    //定义属性属性值
    this.name = name
    this.age = age
}

//父类构造函数 prototype添加函数方法
Father.prototype.f1 = function(){}
Father.prototype.f2 = function(){}

//创建父类实例化对象
const fObj = new Father()

//删除父类实例化对象的属性 - 是为了不继承父类实例化对象的属性属性值
delete( Fobj.name )
delete( Fobj.age )

//定义子类构造函数
function Son( name , age , sex ){

    //继承父类构造函数属性 - 改变this指向
    Father.call( name , age )         //  也可以 Father.apply( name , age )

    //定义自己的属性属性值
    this.sex = sex  
}

//给子类构造函数的prototype 赋值父类的实例化对象
Son.prototype=fObj

//定义子类构造函数自己的函数方法
Son.prototype.ff1 = function(){}
Son.prototype.ff1 = function(){}

//创建子类实例化对象
const sObj = new Son( '李四' , 20 , '男' )
console.log( sObj )               //自己的数据，自己的函数方法， prototype是Father
console.log( sObj.__proto__ )     //是Father的prototype 里面有父类构造函数的函数方法

ES6的继承语法

ES6的原理和ES5的继承原理一样，只是用关键词替我们完成了这些操作

语法：

class F{
    constructor( 参数1 , 参数2 , .... ){
        
        this.属性1 = 参数1
        this.属性2 = 参数3

    }
    
    // 定义函数方法
    f1(){}
    f2(){}
}

class S extends F{
    constructor( name , age , sex ){

        //继承父类属性
        super( name , age )

        //定义自己的属性
        this.sex = sex
    }

    //定义自己的函数方法
    ff1(){}
}

//创建子类实例化对象
const sObj = new Son('李四' , 19 , '男')

//调用父类方法 自己的方法
sObj.f1()
sObj.ff1()

举个例子：

class Father{
    constructor( name , age ){

        this.name = name
        this.age = age
    }

    f1(){}
    f2(name){console.log(name)}
}

class Son extends Father{
    constructor( name , age , sex ){

        //继承父类属性属性值
        super( name , age )

        //定义自己的属性属性值
        this.sex = sex
    }

    //定义自己的函数方法
    ff1(){}
    
}

// 创建子类实例化对象
const sObj = new Son('张三' , 18 , '女')

//调用父类的方法 属性
sObj.f1()
sObj.f2('李四')