资讯专栏INFORMATION COLUMN

javascript继承方法以及优缺点

xiao7cn / 3207人阅读

摘要:前提组合指的是什么就是这两部分的组合构造函数属性的继承和建立子类和父类原型的链接。与此同时,原型链还能保持不变开发人员普遍认为寄生组合式继承是引用类型最理想的继承方式

前提: 组合指的是什么?就是这两部分的组合:构造函数属性的继承和建立子类和父类原型的链接。

借用构造函数继承

最简单的方法,使用call或apply方法,将父对象的构造函数绑定在子对象上

function Super(name){
    this.name=name;
    this.friends = ["小红","小强"];
}
Super.prototype.sayName = function(){
    alert(this.name)
};
function Sub(name){
    Super.apply(this,arguments);
}

var instance1 = new Sub("小明");
var instance2 = new Sub("小明");
instance1.friends.push("张三");
console.log(instance1.friends);//["小红", "小强", "张三"]
console.log(instance2.friends);//["小红", "小强"]

缺点: 没办法继承超类中的原型属性和方法

原型链继承

        function Super(){
            this.name="小明";
        }
        Super.prototype.sayName = function(){
            alert(this.name)
        };
        function Sub(){}
        
        Sub.prototype = new Super();
        
        Sub.prototype.constructor = Sub;  
        //此句的作用是为了不让继承链的紊乱,因为任何一个prototype对象都有一个constructor属性,指向它的构造函数,
        //并且每一个实例也有一个constructor属性,默认调用prototype对象的constructor属性,
        //所以new Animal()的constructor指向Super,导致Sub.prototype.constructor改而指向了Super 为了不导致紊乱 所以要手动指回
        
        var instance = new Sub();
        instance.sayName();//小明

缺点:
1.当父类中包含引用类型属性值时,其中一个子类的多个实例中,只要其中一个实例引用属性只发生修改一个修改,其他实例的引用类型属性值也会立即发生改变
2.原因是父类的属性变成子类的原型属性

组合式继承
(原型继承+借用构造函数继承)

    
        function Super(){
        this.name="小明";
            this.friends = ["小红","小强"];
        }
        Super.prototype.sayName = function(){
            alert(this.name)
        };
        function Sub(){
            Super.call(this);
        }
        
        Sub.prototype = new Super();
        var instance1 = new Sub();
        var instance2 = new Sub();
        instance1.friends.push("张三");
        console.log(instance1.friends);//["小红", "小强", "张三"]
        console.log(instance2.friends);//["小红", "小强"]
        instance1.sayName();//小明
        instance2.sayName();//小明

缺点:
1.两次调用父构造函数 并且子类的自由属性和原型链上的属性会重复覆盖 (打印instance1对象 instance1.prototype和instance1都有一个name属性)
2.同原型链继承的第一个缺点

寄生组合式继承
寄生组合式继承 两步:

1.在子类中调用父类的构造函数:
  Super.apply(this,arguments)
2.建立子类和父类原型的链接 
  最简单的方法就是用Object.create()方法对父类的原型进行浅复制,赋给子类原型:
  Sub.prototype=Object.create(Super.prototype);   //相比之前的原型链继承方法:SubType.prototype=new SuperType();这里没有创建构造函数;

    //寄生组合式继承函数
        function inheritPrototype(sub,super){
            var prototype=Object.create(super.prototype) 
            prototype.constructor = sub; //增强对象
            sub.prototype = prototype; //最后指定对象  
        }
   
    //最终的实现方法
        function Super(name){
            this.name=name;
        }
        Super.prototype.sayName=function(){console.log(this.name)}
        
        function Sub(name,age){
            Super.call(this,name);
            this.age=age;
        }
        inheritPrototype(SubType,SuperType); //实现继承
        
        //其实,说白了寄生组合式继承就是一个借用构造函数 + 相当于浅拷贝父类的原型对象

这种方式的高效率体现它只调用了一次Parent构造函数,并不会创建不必要的、多余的属性。与此同时,原型链还能保持不变;开发人员普遍认为寄生组合式继承是引用类型最理想的继承方式.

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/97408.html

相关文章

  • 【译】每个JavaScript 开发者应该了解的10个面试题

    摘要:避免脆弱的基类问题。红牌警告没有提到上述任何问题。单向数据流意味着模型是单一的事实来源。单向数据流是确定性的,而双向绑定可能导致更难以遵循和理解的副作用。原文地址 1. 你能说出两种对 JavaScript 应用开发者而言的编程范式吗? 希望听到: 2. 什么是函数编程? 希望听到: 3. 类继承和原型继承的不同? 希望听到 4. 函数式编程和面向对象编程的优缺点? ...

    mykurisu 评论0 收藏0
  • JavaScript继承方式及缺点

    摘要:继承简介在的中的面向对象编程,继承是给构造函数之间建立关系非常重要的方式,根据原型链的特点,其实继承就是更改原本默认的原型链,形成新的原型链的过程。 showImg(https://segmentfault.com/img/remote/1460000018998684); 阅读原文 前言 JavaScript 原本不是纯粹的 OOP 语言,因为在 ES5 规范中没有类的概念,在 ...

    nanchen2251 评论0 收藏0
  • 深入理解JavaScript

    摘要:深入之继承的多种方式和优缺点深入系列第十五篇,讲解各种继承方式和优缺点。对于解释型语言例如来说,通过词法分析语法分析语法树,就可以开始解释执行了。 JavaScript深入之继承的多种方式和优缺点 JavaScript深入系列第十五篇,讲解JavaScript各种继承方式和优缺点。 写在前面 本文讲解JavaScript各种继承方式和优缺点。 但是注意: 这篇文章更像是笔记,哎,再让我...

    myeveryheart 评论0 收藏0
  • 7个 Javascript 面试题及回答策略

    摘要:使用异步编程,有一个事件循环。它作为面向对象编程的替代方案,其中应用状态通常与对象中的方法搭配并共享。在用面向对象编程时遇到不同的组件竞争相同的资源的时候,更是如此。 翻译:疯狂的技术宅原文:https://www.indeed.com/hire/i... 本文首发微信公众号:jingchengyideng欢迎关注,每天都给你推送新鲜的前端技术文章 不管你是面试官还是求职者,里面...

    李义 评论0 收藏0
  • JavaScript中的继承

    摘要:前言作为中最重要的内容之一,继承问题一直是我们关注的重点。如果一个类别继承自另一个类别,就把这个称为的子类,而把称为的父类别也可以称是的超类。 前言 作为 JavaScript 中最重要的内容之一,继承问题一直是我们关注的重点。那么你是否清晰地知道它的原理以及各种实现方式呢 阅读这篇文章,你将知道: 什么是继承 实现继承有哪几种方式 它们各有什么特点 这里默认你已经清楚的知道构造函...

    guyan0319 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<