ExtJS在面向对象所作出的努力

ExtJS在面向对象所作出的努力


1：支持命名空间


<script type="text/javascript">


//定义一个命名空间


Ext.namespace("Ext.wentao");


//在命名空间上定义一个类


Ext.wentao.helloworld = Ext.emptyFn;




//创建一个类的实例


new Ext.wentao.helloworld();


</script>
其中


Ext.wentao.helloworld = Ext.emptyFn;
等价于




Ext.wentao.helloworld = function()

{};

2：支持类实例属性


<script type="text/javascript">


Ext.namespace("Ext.wentao"); //自定义一个命名空间


Ext.wentao.Person = Ext.emptyFn; //在命名空间上自定义一个类




//为自定义的类 增加一个 name 属性，并赋值




Ext.apply(Ext.wentao.Person.prototype,

{


name:"刘文涛"


})




var _person = new Ext.wentao.Person();//实例化 自定义类


alert(_person.name);


_person.name = "张三";//修改类name属性


alert(_person.name);


</script>

3：支持类实例方法


<script type="text/javascript">


Ext.namespace("Ext.wentao"); //自定义一个命名空间


Ext.wentao.Person = Ext.emptyFn; //在命名空间上自定义一个类




//演示类实例方法




Ext.apply(Ext.wentao.Person.prototype,

{


name:"刘文涛",


sex:"男",




print:function()

{


alert(String.format("姓名:{0},性别:{1}",this.name,this.sex));


}


})




var _person = new Ext.wentao.Person();//实例化 自定义类


_person.print();


</script>

4：支持类静态方法


<script type="text/javascript">


Ext.namespace("Ext.wentao"); //自定义一个命名空间


Ext.wentao.Person = Ext.emptyFn; //在命名空间上自定义一个类




//演示类实例方法




Ext.apply(Ext.wentao.Person.prototype,

{


name:"刘文涛",


sex:"男",




print:function()

{


alert(String.format("姓名:{0},性别:{1}",this.name,this.sex));


}


})




//演示 类静态方法




Ext.wentao.Person.print = function(_name,_sex)

{


var _person = new Ext.wentao.Person();


_person.name = _name;


_person.sex = _sex;


_person.print(); //此处调用类 实例方法，上面print是类 静态方法


}




Ext.wentao.Person.print("张三","女"); //调用类 静态方法


</script>

5：支持构造方法


<script type="text/javascript">


Ext.namespace("Ext.wentao"); //自定义一个命名空间




//构造方法




Ext.wentao.Person = function(_cfg)

{


Ext.apply(this,_cfg);


}




//演示类实例方法




Ext.apply(Ext.wentao.Person.prototype,

{




print:function()

{


alert(String.format("姓名:{0},性别:{1}",this.name,this.sex));


}


})




//演示 类静态方法




Ext.wentao.Person.print = function(_name,_sex)

{




var _person = new Ext.wentao.Person(

{name:_name,sex:_sex});


_person.print(); //此处调用类 实例方法，上面print是类 静态方法


}




Ext.wentao.Person.print("张三","女"); //调用类 静态方法


</script>

6：支持类继承


<script type="text/javascript">


Ext.namespace("Ext.wentao"); //自定义一个命名空间




//*******************父类*********************


//构造方法




Ext.wentao.Person = function(_cfg)

{


Ext.apply(this,_cfg);


}




//演示类实例方法




Ext.apply(Ext.wentao.Person.prototype,

{


job:"无",




print:function()

{


alert(String.format("姓名:{0},性别:{1},角色:{2}",this.name,this.sex,this.job));


}


})




//*******************子类1*********************






Ext.wentao.Student = function(_cfg)

{


Ext.apply(this,_cfg);


}






Ext.extend(Ext.wentao.Student,Ext.wentao.Person,

{


job:"学生"


})






var _student = new Ext.wentao.Student(

{name:"张三",sex:"女"});


_student.print(); //调用 父类方法


</script>

7：支持类实例方法重写


<script type="text/javascript">


Ext.namespace("Ext.wentao"); //自定义一个命名空间




//*******************父类*********************


//构造方法




Ext.wentao.Person = function(_cfg)

{


Ext.apply(this,_cfg);


}




//演示类实例方法




Ext.apply(Ext.wentao.Person.prototype,

{


job:"无",




print:function()

{


alert(String.format("姓名:{0},性别:{1},角色:{2}",this.name,this.sex,this.job));


}


})




//*******************子类1*********************






Ext.wentao.Student = function(_cfg)

{


Ext.apply(this,_cfg);


}




//重写父类的 实例 方法




Ext.extend(Ext.wentao.Student,Ext.wentao.Person,

{


job:"学生",




print:function()

{


alert(String.format("{0}是一位{1}{2}",this.name,this.sex,this.job));


}


})






var _student = new Ext.wentao.Student(

{name:"张三",sex:"女"});


_student.print(); //调用 父类方法


</script>
8：支持命名空间别名


<script type="text/javascript">


Ext.namespace("Ext.wentao"); //自定义一个命名空间




Wt = Ext.wentao; //命名空间的别名




//*******************父类*********************


//构造方法




Wt.Person = function(_cfg)

{


Ext.apply(this,_cfg);


}




//演示类实例方法




Ext.apply(Wt.Person.prototype,

{


job:"无",




print:function()

{


alert(String.format("姓名:{0},性别:{1},角色:{2}",this.name,this.sex,this.job));


}


})




//*******************子类1*********************






Wt.Student = function(_cfg)

{


Ext.apply(this,_cfg);


}




//重写父类的 实例 方法




Ext.extend(Wt.Student,Ext.wentao.Person,

{


job:"学生",




print:function()

{


alert(String.format("{0}是一位{1}{2}",this.name,this.sex,this.job));


}


})






var _student = new Wt.Student(

{name:"张q三",sex:"女"});


_student.print(); //调用 父类方法


</script>
9：支持类别名


<script type="text/javascript">


Ext.namespace("Ext.wentao"); //自定义一个命名空间




Wt = Ext.wentao; //命名空间的别名




//*******************父类*********************


//构造方法




Wt.Person = function(_cfg)

{


Ext.apply(this,_cfg);


}




PN = Wt.Person; //类别名




//演示类实例方法




Ext.apply(PN.prototype,

{


job:"无",




print:function()

{


alert(String.format("姓名:{0},性别:{1},角色:{2}",this.name,this.sex,this.job));


}


})




//*******************子类1*********************






Wt.Student = function(_cfg)

{


Ext.apply(this,_cfg);


}




ST = Wt.Student;




//重写父类的 实例 方法




Ext.extend(ST,PN,

{


job:"学生",




print:function()

{


alert(String.format("{0}是一位{1}{2}",this.name,this.sex,this.job));


}


})






var _student = new ST(

{name:"张q三",sex:"女"});


_student.print(); //调用 父类方法


</script>
http://www.blogjava.net/liuwentao253/archive/2008/12/20/247534.html