深入理解继承

166 阅读3分钟

这是我参与8月更文挑战的第11天,活动详情查看:8月更文挑战

继承

  • 继承是和构造函数相关的一个应用
  • 是指,让一个构造函数去继承另一个构造函数的属性和方法
  • 所以继承一定出现在 两个构造函数之间

一个小例子

  • 我们之前说,构造函数(类)是对一类行为的描述

  • 那么我们类这个概念其实也很抽象

  • 比如:

    • 我们说 国光 / 富士 都是 苹果的品种,那么我们就可以写一个 苹果类 来实例化很多品种出来
    • 而 苹果 /  这些东西都是水果的一种,那么我们就可以写一个 水果类
    • 说过的统一特点就是  / 水分大 ,而不同的水果有不同的特征
    • 那么我们就可以让 苹果类 来继承 水果类 的内容,然后再用 水果类 去实例化对象
    • 那么实例化出来的就不光有 苹果类 的属性和方法,还有 水果类 的属性和方法

继承的作用

  • 其实说到底,到底什么是继承

  • 我们之前说,在我们书写构造函数的时候,为了解决一个函数重复出现的问题

  • 我们把构造函数的 方法 写在了 prototype 上

  • 这样,每一个实例使用的方法就都是来自构造函数的 prototype 上

  • 就避免了函数重复出现占用内存得到情况

  • 那么,如果两个构造函数的 prototype 中有一样的方法呢,是不是也是一种浪费

  • 所以我们把构造函数䣌 prototype 中的公共的方法再次尽心提取

  • 我们准备一个更公共的构造函数,让构造函数的 __proto__ 指向这个公共的构造函数的 prototype

常见的继承方式

  • 我们有一些常见的继承方式来实现和达到继承的效果

  • 我们先准备一个父类(也就是要让别的构造函数使用我这个构造函数的属性和方法)

    function Person() {
        this.name = 'Jack'
    }
    
    Person.prototype.sayHi = function () {
        cosnole.log('hello')
    }
    
  • 这个 Person 构造函数为父类

  • 让其他的构造函数来继承他

  • 当别的构造函数能够使用他的属性和方法的时候,就达到了继承的效果

原型继承

  • 原型继承,就是在本身的原型链上加一层结构

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

借用构造函数继承

  • 把父类构造函数体借用过来使用一下而已

    function Student() {
      Person.call(this)
    }
    

组合继承

  • 就是把 原型继承 和 借用构造函数继承 两个方式组合在一起

    function Student() {
      Person.call(this)
    }
    Student.prototype = new Person
    

ES6 的继承

  • es6 的继承很容易,而且是固定语法

    // 下面表示创造一个 Student 类,继承自 Person 类
    class Student extends Person {
        constructor () {
            // 必须在 constructor 里面执行一下 super() 完成继承 
            super()
        }
    }
    
  • 这样就继承成功了