MSAJAX第三章-JS创建类(2)-继承类实现

 

接上篇我们已经学会了怎么去创建一个面向对象的 JS 类 ,MSAJAX 的魅力并不是这一些 , 她可以模拟 ( 这里我本想用实现的但个人觉得不太适合 , 因为 JS 的语言的弱特性 , 她不能完全实现面向对象的所有特性 , 即便 MSAJAX 也不行 , 举个简单例子她无法实现访问控制 , 但值得庆信的是他可以模拟出面向对象的招牌特性 - 继承 , 重载 , 接口 , 至于多态个人觉得 JS 无法实现 , 因为 JS 并没法子地位到同一个函数名下的指定的方法 , 因为 ,JS 的编译时覆盖过程 , 多次出现同一个函数名 JS 会把最后一个方法覆盖前一个方法 ) 实现面向对象的特性 话不多说了让我们看看 MSAJAX 是怎么实现类继承和重载的

1. 用到 AJAX 类型

2 实现

3. 注意点

4. 用例

Ø         用到 AJAX 类型

在实现继承之前我们得了解一些继承实现中需要用到的函数 :
        a)      initializeBase 函数 : 用于继承父类构造函数 , 他有 2 个参数 instance ,[ baseArguments ]

                   instance 表示当前实例类一般为 this

baseArguments        表示父类构造函数实现的参数    

b)         callBaseMethod 函数:用于调用父类方法函数他有3个参数 :

instanceVar.callBaseMethod(instance, name , baseArguments );

instance 表示当前实例类一般为 this

name 表示 方法名称

baseArguments 表示父类方法要提供的参数

c)         registerClass 类注册到MSAJAX中

classInstanceVar.registerClass(typeName, baseType, interfaceTypes)

typeName 表示当前类的名字空间

baseType 表示当前类继承与哪个类

interfaceTypes 表示当前类要实现的接口类型

 

Ø         实现 :

第一步 声明类的名字空间 ( 这里不多说了不清楚的朋友可以看上一篇的文章 )

第二步 创建类构造器

                   fww.Employee=function(id,name,title)

{

// 调用父类构造函数传入所需的参数

              fww.Employee.initializeBase(this,[id,name]);

              this._title=title;

}

第三步 实现类属性 ( 这里不多说了不清楚的朋友可以看上一篇的文章 )

     第四步 实现方法重载

         tostring:function()

         {

              // 调用callBaseMethod访问父类的tostring方法,重写tostring方法

              return fww.Employee.callBaseMethod(this,"tostring")+

                   " 我的职位是:'" +this.get_title()+"'.";

         }

     第五步 注册当前类

         fww.Employee.registerClass("fww.Employee",fww.Person);// 我们继承的是Person类

Ø         注意 :

在注册类时要把这个类的完全地址写上即名字空间 ,

我们在构造类时调用 initializeBase 方法是传进去的父类构造函数的参数是一个数组

Ø         实现 :

         // js_ClassType.js

Type.registerNamespace("fww")

 

fww.Person=function(id,name)

{

    this._id=id;

    this._name=name;

}

fww.Person.prototype=

{

    get_id:function()

    {

        return this._id;

    },

    get_name:function()

    {

        return this._name;

    },

    set_name:function(value)

    {

        if(value!=null)

        {

            this._name=value;

        }

    },

    tostring:function()

    {

        return String.format(" 你好,我是{0},我的工号是:{1}" ,this.get_name(),this.get_id());

    }

}

 

fww.Person.registerClass("fww.Person");

 

Type.registerNamespace("fww");

fww.Employee=function(id,name,title)

{

    fww.Employee.initializeBase(this,[id,name]);

    this._title=title;

}

fww.Employee.prototype=

{

    get_title:function()

    {

        return this._title;

    },

    set_title:function(value)

    {

        if(value!=null)

        {

            this._title=value;

        }

    },

    tostring:function()

    {

        return fww.Employee.callBaseMethod(this,"tostring")+

            " 我的职位是:'" +this.get_title()+"'.";

    }

  

}

 fww.Employee.registerClass("fww.Employee",fww.Person);

// ClassTypeDome.aspx

<% @ Page Language="C#" CodeFile="ClassTypeDome.aspx.cs" Inherits="Type_ClassTypeDome" %>

 

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

< html xmlns="http://www.w3.org/1999/xhtml" >

< head runat="server">

    <title> 无标题页</title>

< script language="javascript" type="text/javascript">

<!--

 

function showMe_onclick()

{

    var me=new fww.Person("0001"," 范伟伟" );

    alert(me.tostring());

}

function person_onclick()

{

    var me=new fww.Employee("0001"," 范伟伟" ,"CTO");

    alert(me.tostring());

}

 

function change_onclick()

{

    var me=new fww.Employee("0001"," 范伟伟" ,"CTO");

    alert(me.tostring());

    alert(" 换人" );

    var ceo=new fww.Employee("0002");

    ceo.set_name(" 净化" );

    ceo.set_title("CEO");

     alert(ceo.tostring());

}

// -->

</ script >

</ head >

< body >

    <form id="form1" runat="server">

        <asp:ScriptManager ID="ScriptManager1" runat="server">

        </asp:ScriptManager>

        <input id="showMe" type="submit" value=" 自我介绍" language="javascript" onclick="return showMe_onclick();" />

        <input id="person" type="submit" value=" 具体介绍" language="javascript" onclick="return person_onclick();" />

        <input id="chanName" type="submit" value=" 介绍其他人" language="javascript" onclick="return change_onclick();" />

       

    </form>

</ body >

</ html >

 <script language="javascript" type="text/javascript" src="js_ClassType.js">

 </script>

下一章我们介绍下在类中添加事件和接口实现