053|JavaScript 继承详解

作者: 中年小钢炮 | 来源:发表于2017-05-27 03:03 被阅读62次

    面向对象编程三大特性:封装、继承、多态。封装在前面的课程中已经详解。这一节来了解一下继承。

    继承的意思是,如果A、B两个类型,如果A类型的特性B类型全有,则说B继承于A。继承多可扩展到多个类型,比如再加一个C类型,如果B类型的特性C全有,则说C继承于B类型。因此继承链就是:

    C -> B -> A
    

    继承的原理

    前面的课程中,我们已经知道JavaScript的实例对象有一个__proto__属性。当访问一个实例的属性,如果实例本身中找不到,则会到__proto__中寻找,而instance.__proto__就是class object。

    实际上,JavaScript引擎在处理时,会反复地在__proto__所指向的对象中寻找。也是说,如果__proto__中找不到,则到__proto__.__proto__中寻找... ...依次类推,直到找到或__proto__为空。

    通过__proto__这个特性,我们就能够实现继承。
    假设有A、B两个类型。在没有继承关系下,它们的关系是这图这样的:

    无继承关系下的类图

    在有继承关系的情形下,类图变成了下面这样:

    B继承A情形下的类图

    当B继承A时,B的__proto__指向了A类型的类对象A class object。就是这样一个微小的改变,就使得B继续于A。

    类对象的__proto__默认指向 Object.prototype。

    我们来梳理一下流程,我们以 instance_b.funcA 为入口,我们来分析一下为什么instance_b此时能够调用A类型的funcA方法:

    1. 在instance_b中寻找funcA方法,未找到。
    2. 在instance_b.__proto__中(即B class object)寻找funcA方法,未找到。
    3. 在B class object.__proto__中寻找funcA方法,找到了,返回结果。

    实现继承

    Object.create是一个函数,通过这个函数我们可以设置原型。

    Object.create(proto) // 创建一个新对象,并将这个对象的__proto__设置为参数proto所指对象
    

    因为实现继承需要设置__proto__,而Object.create函数就能够设置__proto__,通过Object.create,我们就能够实现继续。代码举例如下:

    function A()
    {
    }
    A.prototype.funcA=function(){
        console.log("funcA")
    }
    
    function B()
    {
    
    }
    
    B.prototype = Object.create(A.prototype) // 设置继承
    
    var b = new B()
    b.funcA()
    

    好了。这篇内容介绍了JavaScript最为核心的原型模型,掌握好了这一节内容,基本上任何有关JavaScript的面试你都不用惧怕了。

    什么是多态?

    相关文章

      网友评论

        本文标题:053|JavaScript 继承详解

        本文链接:https://www.haomeiwen.com/subject/eqdffxtx.html