JavaScript实现继承

孙泽辉

编程

发布于：2021年5月30日

字数：407字

时长：1分钟

次浏览

面向对象三大特性：继承、封装、多态，今天把JavaScript的继承给他实现了

知识补充

prototype

在JavaScript中，prototype对象是实现面向对象的一个重要机制。

每个函数就是一个对象（Function），函数对象都有一个子对象 prototype对象，类是以函数的形式来定义的。prototype表示该函数的原型，也表示一个类的成员的集合。

constructor

构造函数属于被实例化的特定类对象 。构造函数初始化这个对象，并提供可以访问其私有信息的方法。构造函数的概念可以应用于大多数面向对象的编程语言。

constructor位于prototype中，是prototype的一个属性

手动实现

// 原型工厂继承
function extend(sub, sup) {
    // 将子类的prototype指向父类的prototype（新创建的对象不会污染原prototype）
    sub.prototype = Object.create(sup.prototype)
    // construct被覆盖了，再添加回去,并且禁止遍历
    Object.defineProperty(sub.constructor, "constructor", {
        value: sub,
        enumerable: false
    })
}

这里的create是根据父类的prototype生成一个新对象（深拷贝），将该对象挂载到子类的prototype上，因为constructor是prototype的一个属性，执行完第一步后新对象就把constructor给覆盖了，这个构造函数很重要，要把构造函数重新添加回来

测试：

function Person() {
    this.type = 'animal'
}

function SunZehui() {
    Person.call(this) // 这里相当于super()
}

extend(SunZehui, Person)
console.log('子类prototype：', SunZehui.prototype)
console.log(new SunZehui().type)
/* output:

子类prototype： Person {}
animal

*/

子类要手动执行一下super，这个是为了把父类的属性复制下来