Ext4.2.1学习历程之二：自定义类及类的动态加载

在些extjs类的定义时有必要简单介绍一下js原生态的类定义，已做参考
原生态自定义类：

点击(此处)折叠或打开

1. function Person(name){
   
2.     this.name=name;
   
3.     this.sayHello=function(content){
   
4.         alert(this.name+\'说：\'+content);
   
5.     }
   
6. }
   
7. new Person(\'sc\').sayHello(\'hello world!\')

Extjs4.2自定义类的定义和实例的创建：

点击(此处)折叠或打开

1. Ext.define(\'Myapp.Person\',{
   
2.         config:{
   
3.             name:\'\'
   
4.         },
   
5.         sayHello:function(oparetion){
   
6.          Ext.Msg.alert(this.name,oparetion);
   
7.        },
   
8.          constructor:function(name){
   
9.          this.initConfig(name);
   
10.        }
    
11.     })

一个自定义的类就创建好了，说明：使用Ext.define 来自定义类，通过Ext.define 定义的类都默认继承自Ext.base 类。现在我们在看看怎么创建该类的实例：

点击(此处)折叠或打开

1. Ext.onReady(function(){
   
2.      Ext.create(\"Myapp.Person\",{
   
3.          name:\'sc\'
   
4.      }).sayHello(\'hello world!\');
   
5. })

大家可以参考两种方法比较；
现在我们再来看看动态加载，还是用上面的这个例子演示：

创建一个Person.js的文件，内容为：

点击(此处)折叠或打开

1. Ext.define(\'Myapp.Person\',{
   
2.         config:{
   
3.             name:\'cc\'
   
4.         },
   
5.         sayHello:function(oparetion){
   
6.          Ext.Msg.alert(this.name,oparetion);
   
7.        },
   
8.          constructor:function(name){
   
9.          this.initConfig(name);
   
10.     })

创建一个index.jsp页面，内容：

点击(此处)折叠或打开

1. Ext.onReady(function(){
   
2.      Ext.Loader.setConfig({
   
3.      enabled: true,
   
4.      paths: {
   
5.          Myapp:\"resources/myjs\"
   
6.      }
   
7.      });
   
8.          Ext.create(\"Myapp.Person\",{
   
9.          name:\'sc\'
   
10.      }).sayHello(\'hello world!\');
    
11.     })

1、Ext . Loader . setConfig为动态加载配置项；
2、paths :  { Myapp : "resources/myjs" }中"resources/myjs这段是Person.js的相对路径；
3、Ext.create(\"Myapp.Person\"，{}）中Myapp.Person是自定义类的全名，不可以使用别名，负责是无法找到自定义类的js的；
4、创建的js文件名称必须与 Ext . create ( \ "Myapp.Person\"，{}）中的 Person名称一致，因为在执行的时候会根据 Myapp.Person中的 Person来找Person.js.没有的话就会报错；
最近学习有些忙！写的有些简单，如果有需要交流的童鞋盆友留言交流；

关注博主公众号，永不迷路！实时分享与交流技术动态

来自 “ ITPUB博客 ” ，链接：http://blog.itpub.net/28562677/viewspace-1067421/，如需转载，请注明出处，否则将追究法律责任。

转载于:http://blog.itpub.net/28562677/viewspace-1067421/