JavaScript之组合继承(伪经典继承)

 今天在了解javascript的组合继承时,发现此种继承方式结合了原型链和借用构造函数的方式来实现的,下面对此种继承的方式记录下来,首先来了解实现组合继承的过程。

 1  <script type="text/javascript">
 2     function parent(name) //定义父类
 3     {
 4       this.name=name;  //parent实例属性name
 5       this.color=["red","blue","yellow"]; //parent实例属性color,这个属性值得注意的地方是它的类型是引用类型的
 6     }
 7     parent.prototype.world="Hellow";
 8     parent.prototype.num_arr=[1,2,3,4];    //在原型prototype上添加的属性,在原型prototype对象上添加的属性和方法都是可以共享的
 9     parent.prototype.say=function(){alert('parent_say');} //在原型prototype上添加的方法
10 
11     function son(name,age)   //定义子类
12     {
13       /* 
14           parent.call(this,name); 调用父类构造函数
15           通过借用构造函数的方式来专门实现继承属性
16          ,主要是继承实例属性name,age,color
17          ,而不是父类的原型上添加的属性num_arr
18          ,从而做到每个实例对象(下面实例化的对象s1,s2)都有自己的私有属性name,age,color
19          ,这样在修改各自的私有属性时互不影响,特别是在修改引用类型的属性color的时候.
20       */
21       parent.call(this,name); 
22       this.age=age;  //son的实例属性age
23     }
24     /*
25       son.prototype=new parent("jackie"); 原型继承
26       通过原型链的形式来是实现继承是一种常见的方式,在应用中,如果实例对象要共享某个方法或属性时,
27       则通过在prototype对象上进行添加属性和方法是实现共享引用类型属性(num_arr)和方法(say)的一种最佳方式
28     */
29     son.prototype=new parent("jackie"); 
30 
31     var s1=new son("lily",34);
32     var s2=new son("kate",28);
33 
34     s1.color.push("black");   //这是s1对象对parent.color实例属性进行了操作,但是却不会影响到s2.color
35     alert("s1.color="+s1.color+"\ns2.color="+s2.color);  
36     /*
37         这是上面的输出结果
38         s1.color=red,blue,yellow,black
39         s2.color=red,blue,yellow
40     */
41 
42 
43     s1.num_arr.push(5);  
44     alert("s1.num_arr="+s1.num_arr+"\ns2.num_arr="+s2.num_arr);
45     /*
46        这时对parent.prototype上的引用类型属性(num_arr)进行操作时,会影响到s2.num_arr
47        ,原因就是prototype对象添加的属性都是共享的,尤其是添加的引用类型的属性
48         s1.num_arr=1,2,3,4,5
49         s2.num_arr=1,2,3,4,5
50     */
51     s1.world="China";
52     alert("s1.world="+s1.world+"\ns2.world="+s2.world);
53     /*
54         这是s1对象对parent.prototype对象的非引用类型属性world进行操作,这时也不会影响到s2.world
55         输出结果为:
56         s1.world=China
57         s2.world=Hellow
58     */
59 </script>

原文地址:http://handyxuefeng.blog.163.com/blog/static/45452172201162014851622/

posted @ 2013-03-15 09:50  Bupamafan  阅读(263)  评论(0编辑  收藏  举报