• Javascript 组合继承 原型链继承 寄生继承


    Javascript继承通常有三种方式。

    第一种:组合式继承

        function SuperType(name) {
            this.name = name;
            this.colors = ["red", "blue", "green"];
        }
        SuperType.prototype.sayName = function() {
            console.log(this.name);
        };
        function SubType(name, age) {
            //通过call()调用SuperType的构造函数,继承SuperType属性
            SuperType.call(this, name);                 //第二次调用      SuperType()
            this.age = age;
        }
        SubType.prototype = new SuperType();  //第一次调用
        SubType.prototype.sayAge = function() {
            console.log(this.age);
        };
        var instancel = new SubType("Nicholas", 12);    
        SuperType()

    该继承通过构造函数继承原型链的方法和父类的属性,但该方法会有两次调用父类,第一次是在继承原型链,第二次在继承属性。

    第二种:原型链继承

    //原型式继承实例代码:
        function createObj(o) {//对传入的对象执行了一次浅复制
            function F() {}
            F.prototype = o;
            return new F();
        }
        var person = {
            name: "Tom",
            friends: ["one", "two", "van"]
        };
        var huPs = createObj(person);
        huPs.name = "GRE";
        huPs.friends.push("Rob");
    
        var yePs = createObj(person);
        yePs.name = "Lin";
        yePs.friends.push("Sari");
    
        console.log(person.friends);//"one,two,van,Rob,Sari"

    这个没什么,Js的原型继承特性。

    第三种:寄生式继承

    在第一种的方法上,我们在第一次调用父类,也就是继承原型的时候,实际上只需要父类的原型副本,那么取得副本,也就省去了这一次调用。

    该继承技术是最常用的。

    function inheritPrototype(subType, superType) {
            var prototype = object(superType.prototype);    //创建对象 超类型原型副本
            prototype.constructor = subType;                //增强对象 为副本增添construct属性
            subType.prototype = prototype;                  //指定对象
        }
        function SuperType(name) {
            this.name = name;
            this.colors = ["red", "blue", "green"];
        }
        SuperType.prototype.sayName = function() {
            console.log(this.name);  
        };
        function SubType(name, age) {
            SuperType.call(this, name);
            this.age = age;
        }
        inheritPrototype(SubType, SuperType);
        SubType.prototype.sayAge = function() {
            console.log(this.age);
        };

     该文章参考自https://my.oschina.net/quidditch/blog/307551

  • 相关阅读:
    轻量级的Web服务器Nginx0.9.0 开发版发布 狼人:
    微软发布Silverlight 5 Beta新特性 狼人:
    TechCrunch新闻评论:Flash耗电问题严重 狼人:
    IE9是最佳浏览器? 狼人:
    Silverlight面向客户端,HTML5面向Web 狼人:
    Silverlight 结构分析 狼人:
    HTML5是否已经准备好了?仍在W3C层层审核当中 狼人:
    Adobe驳斥Flash过度耗电论 称HTML5更耗电 狼人:
    Silverlight 5即将来临 狼人:
    运行控制[置顶] 有趣的编程控制自己电脑的CPU
  • 原文地址:https://www.cnblogs.com/Darlietoothpaste/p/6682296.html
Copyright © 2020-2023  润新知