码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript对象 继承

时间:2014-08-08 15:23:16      阅读:221      评论:0      收藏:0      [点我收藏+]

标签:style   blog   color   java   使用   io   strong   ar   

JavaScript继承主要依靠原型链实现。

原型链

利用原型让一个引用类型继承另一个引用类型水位属性和方法。

每一个构造函数都有一个原型对象,原型对象都包含一个指向构造函数的指针,而实例都包含一个指向原型对象的内部指针。

                    
        function SuperType(){
            this.property = true;
        }
        
        SuperType.prototype.getSuperValue = function(){
            return this.property;
        };
        
        function SubType(){
            this.subproperty = false;
        }
        
        //inherit from SuperType
        SubType.prototype = new SuperType();
        
        //new method
        SubType.prototype.getSubValue = function (){
            return this.subproperty;
        };
        
        //override existing method
        SubType.prototype.getSuperValue = function (){
            return false;
        };
        
        var instance = new SubType();
        alert(instance.getSuperValue());   //false

原型链的问题:1 原型对象包含引用类型值得属性;2 不能向超类型的构造函数中传递参数。

使用构造函数

在子类型的构造函数的内部调用超类型的构造函数。

        function Person(name, age, job){
            this.name = name;
            this.age = age;
            this.job = job;
            this.sayName = function(){
                alert(this.name);
            };
        }
        
        var person = new Person("Nicholas", 29, "Software Engineer");
        person.sayName();   //"Nicholas"
        
        Person("Greg", 27, "Doctor");  //adds to window
        window.sayName();   //"Greg"
        
        var o = new Object();
        Person.call(o, "Kristen", 25, "Nurse");
        o.sayName();    //"Kristen"

使用构造函数的问题:方法都要在构造函数中定义。

组合继承

使用原型链和构造函数组合

        function SuperType(name){
            this.name = name;
            this.colors = ["red", "blue", "green"];
        }
        
        SuperType.prototype.sayName = function(){
            alert(this.name);
        };

        function SubType(name, age){  
            SuperType.call(this, name);
            
            this.age = age;
        }

        SubType.prototype = new SuperType();        
        SubType.prototype.constructor = SubType; 
SubType.prototype.sayAge
= function(){ alert(this.age); }; var instance1 = new SubType("Nicholas", 29); instance1.colors.push("black"); alert(instance1.colors); //"red,blue,green,black" instance1.sayName(); //"Nicholas"; instance1.sayAge(); //29 var instance2 = new SubType("Greg", 27); alert(instance2.colors); //"red,blue,green" instance2.sayName(); //"Greg"; instance2.sayAge(); //27

 寄生组合式继承   

在组合继承中,会两次调用超类型的构造函数(第1是在SubType.prototype = new SuperType();第2是在SuperType.call(this, name);),会生成两组属性,一组在实例上,一组在原型中。

寄生组合式继承是实现基于类型继承最有效的方式

        function object(o){
            function F(){}
            F.prototype = o;
            return new F();
        }
    
        function inheritPrototype(subType, superType){
            var prototype = object(superType.prototype);   //create object
            prototype.constructor = subType;               //augment object
            subType.prototype = prototype;                 //assign object
        }
                                
        function SuperType(name){
            this.name = name;
            this.colors = ["red", "blue", "green"];
        }
        
        SuperType.prototype.sayName = function(){
            alert(this.name);
        };

        function SubType(name, age){  
            SuperType.call(this, name);
            
            this.age = age;
        }

        inheritPrototype(SubType, SuperType);
        
        SubType.prototype.sayAge = function(){
            alert(this.age);
        };
        
        var instance1 = new SubType("Nicholas", 29);
        instance1.colors.push("black");
        alert(instance1.colors);  //"red,blue,green,black"
        instance1.sayName();      //"Nicholas";
        instance1.sayAge();       //29
        
       
        var instance2 = new SubType("Greg", 27);
        alert(instance2.colors);  //"red,blue,green"
        instance2.sayName();      //"Greg";
        instance2.sayAge();       //27

--以上内容来自JavaScript高级程序设计

JavaScript对象 继承,布布扣,bubuko.com

JavaScript对象 继承

标签:style   blog   color   java   使用   io   strong   ar   

原文地址:http://www.cnblogs.com/YuanSong/p/3899058.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!