龙盟编程博客 | 无障碍搜索 | 云盘搜索神器
快速搜索
主页 > web编程 > Javascript编程 >

没那么简单 那些应该吃透的JavaScript概念(1)(3)

时间:2013-03-06 14:58来源:未知 作者:admin 点击:
分享到:
六,继承 如果两个类都是同一个实例的类型,那么它们之间存在着某种关系,我们把同一个实例的类型之间的泛化关系称为继承。C#和JAVA中都有这个,具

六,继承

如果两个类都是同一个实例的类型,那么它们之间存在着某种关系,我们把同一个实例的类型之间的泛化关系称为继承。C#和JAVA中都有这个,具体的理解就不说了。在JavaScript中,并不直接从方法上支持继承,但是就像前面说的,可以模拟。

方法可以归纳为四种:构造继承法,原型继承法,实例继承法和拷贝继承法。融会贯通之后,还有混合继续法,这是什么法,就是前面四种挑几种混着来。以下例子来源于王者归来,其中涉及到了apply,call和一些Array的用法,有兴趣的可以自己在园子里搜索一下。

1,构造继续法例子:

  1. //定义一个Collection类型  
  2. functionCollection(size)  
  3. {  
  4. this.size=function(){returnsize};//公有方法,可以被继承  
  5. }  
  6.  
  7. Collection.prototype.isEmpty=function(){//静态方法,不能被继承  
  8. returnthis.size()==0;  
  9. }  
  10. //定义一个ArrayList类型,它"继承"Collection类型  
  11. functionArrayList()  
  12. {  
  13. varm_elements=[];//私有成员,不能被继承  
  14. m_elements=Array.apply(m_elements,arguments);  
  15.  
  16. //ArrayList类型继承Collection  
  17. this.base=Collection;  
  18. this.base.call(this,m_elements.length);  
  19.  
  20. this.add=function()  
  21. {  
  22. returnm_elements.push.apply(m_elements,arguments);  
  23. }  
  24. this.toArray=function()  
  25. {  
  26. returnm_elements;  
  27. }  
  28. }  
  29.  
  30. ArrayList.prototype.toString=function()  
  31. {  
  32. returnthis.toArray().toString();  
  33. }  
  34. //定义一个SortedList类型,它继承ArrayList类型  
  35. functionSortedList()  
  36. {  
  37. //SortedList类型继承ArrayList  
  38. this.base=ArrayList;  
  39. this.base.apply(this,arguments);  
  40.  
  41. this.sort=function()  
  42. {  
  43. vararr=this.toArray();  
  44. arr.sort.apply(arr,arguments);  
  45. }  
  46. }  
  47.  
  48. //构造一个ArrayList  
  49. vara=newArrayList(1,2,3);  
  50. dwn(a);  
  51. dwn(a.size());//a从Collection继承了size()方法  
  52. dwn(a.isEmpty);//但是a没有继承到isEmpty()方法  
  53.  
  54. //构造一个SortedList  
  55. varb=newSortedList(3,1,2);  
  56. b.add(4,0);//b从ArrayList继承了add()方法  
  57. dwn(b.toArray());//b从ArrayList继承了toArray()方法  
  58. b.sort();//b自己实现的sort()方法  
  59. dwn(b.toArray());  
  60. dwn(b);  
  61. dwn(b.size());//b从Collection继承了size()方法 

2,原型继承法例子

  1. //定义一个Point类型  
  2. functionPoint(dimension)  
  3. {  
  4.  
  5. this.dimension=dimension;  
  6. }  
  7.  
  8. //定义一个Point2D类型,"继承"Point类型  
  9. functionPoint2D(x,y)  
  10. {  
  11. this.x=x;  
  12. this.y=y;  
  13. }  
  14. Point2D.prototype.distance=function()  
  15. {  
  16. returnMath.sqrt(this.x*this.x+this.y*this.y);  
  17. }  
  18. Point2D.prototype=newPoint(2);//Point2D继承了Point  
  19.  
  20. //定义一个Point3D类型,也继承Point类型  
  21. functionPoint3D(x,y,z)  
  22. {  
  23. this.x=x;  
  24. this.y=y;  
  25. this.z=z;  
  26. }  
  27. Point3D.prototype=newPoint(3);//Point3D也继承了Point  
  28.  
  29. //构造一个Point2D对象  
  30. varp1=newPoint2D(0,0);  
  31. //构造一个Point3D对象  
  32. varp2=newPoint3D(0,1,2);  
  33. dwn(p1.dimension);  
  34. dwn(p2.dimension);  
  35. dwn(p1instanceofPoint2D);//p1是一个Point2D  
  36. dwn(p1instanceofPoint);//p1也是一个Point  
  37. dwn(p2instanceofPoint);//p2是一个Point 

以上两种方法是最常用。

3,实例继承法例子

在说此法例子之前,说说构造继承法的局限,如下:

  1. functionMyDate()  
  2. {  
  3. this.base=Date;  
  4. this.base.apply(this,arguments);  
  5. }  
  6. vardate=newMyDate();  
  7. alert(date.toGMTString);//undefined,date并没有继承到Date类型,所以没有toGMTString方法 

核心对象的某些方法不能被构造继承,原因是核心对象并不像我们自定义的一般对象那样在构造函数里进行赋值或初始化操作换成原型继承法呢?,如下:

  1. functionMyDate(){}  
  2. MyDate.prototype=newDate();  
  3. vardate=newMyDate();  
  4. alert(date.toGMTString);//'[object]'不是日期对象,仍然没有继承到Date类型! 

现在,换成实例继承法:

  1. functionMyDate()  
  2. {  
  3. varinstance=newDate();//instance是一个新创建的日期对象  
  4. instance.printDate=function(){  
  5. document.write("<p>"+instance.toLocaleString()+"</p>");  
  6. }//对instance扩展printDate()方法  
  7. returninstance;//将instance作为构造函数的返回值返回  
  8. }  
  9. varmyDate=newMyDate();  
  10. dwn(myDate.toGMTString());//这回成功输出了正确的时间字符串,看来myDate已经是一个Date的实例了,继承成功  
  11. myDate.printDate();//如果没有returninstance,将不能以下标访问,因为是私有对象的方法 

4,拷贝继承法例子

  1. Function.prototype.extends=function(obj)  
  2. {  
  3. for(vareachinobj)  
  4. {  
  5. this.prototype[each]=obj[each];  
  6. //对对象的属性进行一对一的复制,但是它又慢又容易引起问题  
  7. //所以这种“继承”方式一般不推荐使用  
  8. }  
  9. }  
  10. varPoint2D=function(){  
  11. //……  
  12. }  
  13. Point2D.extends(newPoint())  
  14. {  
  15. //……  

这种继承法似乎是用得很少的。

5,混合继承例子

  1. functionPoint2D(x,y)  
  2. {  
  3. this.x=x;  
  4. this.y=y;  
  5. }  
  6. functionColorPoint2D(x,y,c)  
  7. {  
  8. Point2D.call(this,x,y);//这里是构造继承,调用了父类的构造函数  
  9. //从前面的例子看过来,这里等价于  
  10. //this.base=Point2D;  
  11. //this.base.call(this,x,y);  
  12. this.color=c;  
  13. }  
  14. ColorPoint2D.prototype=newPoint2D();//这里用了原型继承,让ColorPoint2D以Point2D对象为原型 

精彩图集

赞助商链接