ExtJS之面向对象的概念

大家应该知道,JS是具有面向对象的脚本语言,而在OOP中,类与对象的概念十分重要。那么在ExtJS中类的概念又如何体现的呢。(例子来源于网上,如有违反原作者的行为,请告知)

下面我用一个例子做一下简单介绍:

Ext.namespace(“Ext.MySpace”); //自定义一个命名空间
Ext.MySpace.Person = Ext.emptyFn;//在命名空间上自定义一个类,这里的Ext.emptyFn等同于function(){}
        
//为自定义的类增加name、sex属性,print方法
Ext.apply(Ext.MySpace.Person.prototype,{
    name:”李四”,
    sex:”男”,
    print:function(){
        alert(String.format(“姓名:{0},性别:{1}”,this.name,this.sex));
        }
});
var _person = new Ext.MySpace.Person();//类的实例化 _person.name = “张三”; //修改类name属性 _person.sex = “女”; //修改类sex属性 _person.print(); //实现自定义类的方法 //演示类静态方法 Ext.MySpace.Person.show= function(_name,_sex){ var _person = new Ext.MySpace.Person();//类的实例化 _person.name = _name; _person.sex = _sex; _person.print(); }; Ext.MySpace.Person.show(“张三”,”女”);

  上面同个一个例子简单的介绍了ExtJS下命名空间、类以及类的属性方法、类的实例化以及对类属性的修改、类静态方法的使用。这仅仅是一些基础的东西。下面将进一步的了解一些知识点:

Ext.namespace(“Ext.MySpace”); //自定义一个命名空间
//构造方法
Ext.MySpace.Person = function(_ms){
       Ext.apply(this._ms);
}
//类静态方法
Ext.MySpace.Person.show = function(_name,_sex){
var _person = new Ext.MySpace.Person({name:_name,sex:_sex});
_person.print();
};
Ext.MySpace.Person.show("张三","女");
//当然,为了看结果,你可以为Ext.MySpace.Person类增加print方法
Ext.apply(Ext.MySpace.Person.prototype,{
print:function(){
 alert(String.format("姓名:{0},性别:{1}",this.name,this.sex));
}
})

  类的继承以及类方法的重写:

Ext.namespace(“Ext.MySpace”); //自定义一个命名空间
//-------父类------
Ext.MySpace.Person = function(_ms){
       Ext.apply(this._ms);
}
Ext.apply(Ext.MySpace.Person.prototype,{
print:function(){
 alert(String.format("姓名:{0},性别:{1},角色:{2}",this.name,this.sex,this.job));
}
})
//-------子类------------
Ext.MySpace.Student = function(_ms){
Ext.apply(this,_ms);
}
Ext.extend(Ext.MySpace.Student,Ext.MySpace.Person,{
job:"学生",
//重写父类中的方法
print:function(){
alert(String.format("{0}是一位{1}{2}",this.name,this.sex,this.job))
}
})
var _student = new Ext.MySpace.Student({name:"张三",sex:"女"});
_student.print();//调用父类中的方法

  

原文地址:https://www.cnblogs.com/mdorg/p/2780471.html