标签: 继承

  • 继承

    什么是继承?

    继承一些需要重复使用的属性和方法

    原型链继承

    语法

    子构造函数.prototype = new 父构造函数()

    注:原型链继承代码必须在创建实例对象之前

    (实例对象在创建的那一刻起,其原型链就定下来了)

    //定义Person构造函数
    function Person() {}
    Person.prototype.sayHi = function () {
        console.log('hi~')
    }
    
    //定义Student构造函数
    function Student() {}
    
    //原型继承: 利用原型链, 继承于父级构造函数, 继承原型上的方法
    Student.prototype = new Person()
    //构造函数指向改回Student 否则会指向Person
    Student.prototype.constructor = Student
    let one = new Student()
    one.sayHi() //继承了Person的sayHi方法

    组合继承( 原型链 + 构造函数 )

    又称伪经典继承

    原型链主要用于实例对象继承方法构造函数用于实现实例对象属性的继承

    不足

    二次调用父类构造函数

    //定义Person构造函数
    function Person(name) {
        this.name = name
    }
    Person.prototype.sayHi = function () {
        console.log('hi~')
    }
    
    //定义Student构造函数
    function Student(name,id) {
      //第二次调用父类构造函数
      Person.call(this,name) // 实现属性的继承
         this.id = id
    }
    
    //原型继承: 利用原型链, 继承于父级构造函数, 继承原型上的方法
    //第一次调用父类构造函数
    Student.prototype = new Person()
    
    let one = new Student('Liao',1)
    one.sayHi() //继承了Person的sayHi方法

    寄生组合继承

    通过借用构造函数来继承属性,通过原型链形式来继承方法,会解决2次调用父类函

    数以及复用率的问题。

    上例中,Student实例上有name了,原型__proto__上不需要再有这些属性,利用Object.create()改造

    Object.create(参数对象), Object.create 会创建一个新对象, 并且这个新对象的__proto__ 会指向传入参数对象

    简单理解

    Object.create()通过括号内的参数对象,创建一个新的对象出来,新对象的__proto__指向参数对象

    Student.prototype = Object.create(Person.prototype)
    //效果等价于(本质还是有区别)
    Student.prototype.__proto__ = Person.prototype
    //定义Person构造函数
    ···
    //定义Student构造函数
    ···
    //利用fn.call()方法,Student已经继承了Person构造函数中的属性
    
    //原型继承
    Student.prototype = Object.create(Person.prototype)

    总结

    Object.create() 以参数的对象, 作为新建对象的__proto__属性的值, 返回新建的对象

    寄生组合式继承 – 简书

    JS 常见的 6 种继承方式_jatej的博客-CSDN博客