在JScript面向对象编程中使用重载(续)

简介:
上周在关于JavaScript面向对象编程的话题中,我讲过怎么' 在JavaScript面向对象编程中使用重载'。虽然那个方法需要使用一个call函数来调用基类被重载的方法,看起来比较怪不说。不过更大的问题却是那个方法只支持两级继承的基类方法调用,使用起来真是如食鸡肋。

    后来仔细研究了一下call函数的执行过程和原理,发现要实现" 重载"一文中的任意级别类调用其直接基类方法是可以实现的。还记得上次那个示例吗?三个类:grandpa、father & son。father继承于grandpa,son继承与father,它们都有一个叫getName()的方法。father中的getName()中使用 this.base.getName.call( this);没有问题,而不能再在son的getName()中使用 this.base.getName.call( this),因为son的基类father的getName()方法中已经有了基类调用。

    在上次的示例中,son如果执意要调用getName()。执行的结果我说过的,将会是无限递归,最后IE脚本解析器的函数堆栈overflow,甚至IE也一块儿crash掉。问题出在调用son中的getName()方法中的 this.base.getName.call( this)后, this(call的参数)被置换到father对象的实例中去了,这时执行getName()时,除了函数是由father类提供的外,此时的 this就是son的那个实例。在这个时候再调用father中getName(),getName中的 this.base.getName.call( this)其实是 this(son的实例).base.getName.call( this(son的实例)),看出问题了吧?无限递归就在这里开始了,因为永远都只能在father(这时的实例 this其实是son的)的getName()方法中调用" this(son的实例).base.getName.call( this(son的实例))"。

    现在问题清楚地摆在眼前了,并且也知道是怎么产生的了,接下来的任务就是解决掉它!

    解决问题的关键就点是: 因为永远都只能在father(这时的实例this其实是son的)的getName()方法中调用"this(son的实例).base.getName.call(this(son的实例))"。如果我们知道这时我们其实不是在son的实例中,而是在father的实例中,执行的是: this(father的实例).base.getName.call( this(son的实例))"。这就对了。

    那么我们有办法知道这第一个 this不是son的而应该是father的吗?好像很难,因为 this确确实实就是son的嘛。不能再从 this本身去打主意了,那么我们怎么办?不是还有一个getName()方法吗?它可是来自father的实例的噢!因为call( this)只是置换了该方法中本身的 this(father的实例),所以我们可以通过查找函数的方式来确定当前方法的本身实例(被call方法替换之前的)是谁。

    为此我重写了call函数,名叫Call。调用界面和call相同,功能也相同(内部就是用的call,毕竟我这里不是在模拟call)。还差点忘了,除非我特殊说明,我在JavaScript面向对象编程中的继承,默认都是使用的" 附加继承法"。Call函数源代码如下:
None.gif  /* **********************************************************
None.gif CommonLab JScript Code Library
None.gif
None.gif Author: lizhi[at]hit.edu.cn[http://www.cnblogs.com/birdshome/]
None.gif Company: http://www.u-soft.com.cn/
None.gif Copyright: U-Soft Co., Ltd. © All rights reserved.
None.gif
None.gif Version: 1.0
None.gif Created: 2004.11.30 22:27
None.gif Updated: 2005.02.28 18:00
None.gif
None.gif History:
None.gif     8. Attach 'Call' method to Function. [2005.02.23]
None.gif
None.gif Announce: You may use the code freely if this comment reserved.
None.gif    
None.gif *********************************************************
*/
None.gif
None.gif Function.prototype.Call =  function(that)
None.gif {
None.gif      if ( arguments.length < 1 )
None.gif     {
None.gif          throw  new Error('The first parameter must be swapped object.');
None.gif     }
None.gif      var thatBase = that;
None.gif      do
None.gif     {
None.gif          for (  var key  in thatBase )
None.gif         {
None.gif              if ( thatBase[key] == arguments.callee.caller )
None.gif             {
None.gif                  if ( arguments.length == 1 )
None.gif                 {
None.gif                      return thatBase.base[key].call(that);
None.gif                 }
None.gif                  else
None.gif                 {
None.gif                      var args = [];
None.gif                      for (  var i=1 ; i < arguments.length ; ++i )
None.gif                     {
None.gif                         args.push(arguments[i]);
None.gif                     }
None.gif                     return thatBase.base[key].apply(that, args);
None.gif                 }
None.gif             }
None.gif         }
None.gif     }
None.gif     while ( thatBase = thatBase.base )
None.gif };
    谢谢您保留版权信息,同时它也是一个授权。

    把"重载"一文中的那三个类中的call全改为Call(调用参数不变),运行如下示例代码:
ExpandedBlockStart.gif     < script  language ="javascript" >
InBlock.gif    
var  g  =   new  grandpa('Michael', 'William');
InBlock.gif    alert(g.getName()); 
InBlock.gif    
var  f  =   new  father('John', 'William');
InBlock.gif    alert(f.getName());
InBlock.gif    
var  s  =   new  son('Tom', 'William');
InBlock.gif    alert(s.getName());
InBlock.gif    
//  alert(s.getFamilyName()); 
ExpandedBlockEnd.gif
     </ script >

    运行结果为:
    No.1 alert:
None.gif grandpa's name: Michael
    No.2 alert:
None.gif grandpa's name: John
None.gif father's name: John
    No.3 alert:
None.gif grandpa's name: Tom
None.gif father's name: Tom
None.gif son's name: Tom

    例子不甚恰当,不过更多是为了表明清楚它们之间的继承层次关系。


本文转自博客园鸟食轩的博客,原文链接:http://www.cnblogs.com/birdshome/,如需转载请自行联系原博主。

目录
相关文章
|
1月前
|
JavaScript 前端开发
JavaScript 原型链继承:掌握面向对象的基础
JavaScript 原型链继承:掌握面向对象的基础
|
1月前
|
编译器 C++
在C++语言中类的重载
在C++语言中类的重载
13 0
|
1月前
|
存储 JSON 前端开发
JavaScript:构造函数&面向对象
JavaScript:构造函数&面向对象
38 2
|
JavaScript 前端开发
JavaScript 面向对象之继承
JavaScript 面向对象之继承
107 0
JavaScript 面向对象之继承
|
JavaScript 前端开发
【JavaScript】24_面向对象中的方法和构造函数
# 4、方法 ```html <script> class Person{ name = "孙悟空" // sayHello = function(){ // } // 添加方法的一种方式 sayHello(){ console.log('大家好,我是' + this.name) } // 添加方法(实例方法) 实例方法中this就是当前实例 static test
70 0
|
JavaScript 前端开发 关系型数据库
【JavaScript】26_面向对象——继承
# 8、继承 - 可以通过extends关键来完成继承 时,就相当于将另一个类中的代码复制到了当前类中(简单理解) - 继承发生时,被继承的类称为 父类(超类),继承的类称为 子类 的代码,并且可以在不修改一个类的前提对其进行扩展 ​ 封装 —— 安全性 ​ 继承 —— 扩展性 ​ 多态 —— 灵活性 ```html <script> class Animal{ constructor(name){ this.n
61 0
|
JavaScript 前端开发
【JavaScript】面向对象——构造函数(详解)
【JavaScript】面向对象——构造函数(详解)
112 0
|
JavaScript 前端开发
关于JavaScript面向对象中构造函数和原型对象的学习与理解
面向对象就是把需要解决的问题分解成一个个对象,建立对象不是为了实现一个步骤,而是为了描述每个对象在解决问题中的行为,面向对象的核心是对象。
82 0
关于JavaScript面向对象中构造函数和原型对象的学习与理解
|
JavaScript 前端开发
Javascript面向对象——创建对象、构造函数的原型
Javascript面向对象——创建对象、构造函数的原型
|
开发框架 .NET C#
面向对象——扩展方法
面向对象——扩展方法
124 0

热门文章

最新文章