JavaScript高级程序设计一书中对组合继承的理解

来源:互联网 发布:淘宝k8分销平台可靠吗 编辑:程序博客网 时间:2024/05/16 06:04

在JavaScript高级程序设计一书中关于组合继承有这样一段代码:

    <script type="text/javascript">                            function SuperType(name){            this.name = name;            this.colors = ["red", "blue", "green"];        }                SuperType.prototype.sayName = function(){            alert(this.name);        };        function SubType(name, age){              //借用构造函数的方式(.call)来继承SuperType()函数的属性和方法            SuperType.call(this, name);            this.age = age;        }        //将SubType的原型对象SubType.prototype设定为SuperType()的构造函数        SubType.prototype = new 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                   </script>

首先,我们定义了一个SuperType(name)函数为其添加了两个属性,然后为SuperType(name)函数创建了它的原型SuperType.prototype并为其添加sayName()方法,其次再定义了SubType(name,age)函数为其添加age属性,并且以借用构造函数的方式(.call)来继承SuperType()函数的属性和方法,至此SubType()函数就拥有了三个属性(name、colors、age),接下来我们将SubType的原型对象SubType.prototype设定为SuperType()的构造函数,并为其添加sayAge()方法。当我们创建SubType()的构造函数instance1和instance2,这两个构造函数便自动拥有了SubType()、SubType.prototype、SuperType.prototype的所有属性和方法。

在这段函数中使用到了两种继承方式:原型链和借用构造函数,单独使用原型链继承的方式会导致instance2的colors属性跟随instance1的改变而变化(colors属性为引用类型),借用构造函数继承的原理就是在每次创建构造函数的时候都为构造函数创建一个副本类似于复制粘贴变成了私有属性,所以在遇到引用类型继承的时候便可以组合使用两种继承方式达到取长补短的效果。

就是在每次创建构造函数的时候都为构造函数创建一个副本类似于复制粘贴变成了私有属性,所以在遇到引用类型继承的时候便可以组合使用两种继承方式达到取长补短的效果。

原创粉丝点击