Sencha Touch 2 学习笔记(二)----定义类与类的继承（转）

转载链接：http://extjs.org.cn/node/544

 

原文链接：http://chennaigong.iteye.com/blog/1545057

 

最近几天学了下sencha touch2的一些基本控件和一些写法。都是很基础的（呵呵  高级的我学不会。。）

sencha touch2的语法感觉很像面向对象的语法。有自己的类，类可以继承。（现在语言貌似都向oop靠拢。。）。

sencha touch2如果项目大的话有一种mvc的架构写法。这以后贴代码给大家看吧。

这篇文章讲的是sencha touch2的类。

废话不多说了。开始吧。

首先你先配置下sencha touch2的环境，导入sdk什么的，请参照http://chennaigong.iteye.com/admin/blogs/1542268。

 

配置好了环境之后，就可以在app.js里写代码喽。

 

首先申明一个类：

 

Java代码  

1. Ext.define(  
2. "Animal",  
3. {  
4.     config:  
5.     {  
6.         name:null  
7.     },  
8.     constructor:function(config)  
9.     {  
10.         this.initConfig(config);  
11.     },  
12.     speak:function()  
13.     {  
14.         Ext.Msg.alert("123");  
15.     }  
16. }  
17. )  

 看得懂吧。申明了"Animal"这个类,然后申明name这个变量,constructor就是这个类初始化时要调用的。speak是一个方法。把这句翻译成Java代码可以如下：

 

 

Java代码  

1. public class Animal  
2. {  
3.     String name;  
4.   
5.     public String getName()  
6.     {  
7.         return name;  
8.     }  
9.     public void setName(String name)  
10.     {  
11.         this.name = name;  
12.     }  
13.       
14.     public void speak()  
15.     {  
16.         System.out.print("123");  
17.     }  
18. }  

呵呵  当你在sencha touch2里申明name变量时，他会自动生成getter和setter存取方法的。当然这里的name不一定是String类型的。

然后可以调用这个类了 。完整的写法如下：

 

Java代码  

1. Ext.application(  
2. {  
3.     name:"sencha",  
4.     launch:function()  
5.     {  
6.         var my=Ext.create("Animal",{name:"bob"})  
7.         my.speak();  
8.     }  
9. }  
10. )  
11.   
12. Ext.define(  
13. "Animal",  
14. {  
15.     config:  
16.     {  
17.         name:null  
18.     },  
19.     constructor:function(config)  
20.     {  
21.         this.initConfig(config);  
22.     },  
23.     speak:function()  
24.     {  
25.         Ext.Msg.alert("123");  
26.     }  
27. }  
28. )  

 然后类的继承写法如下：

 

 

Java代码  

1. Ext.define(  
2. "Person",  
3. {  
4.     extend:"Animal",  
5.     speak:function()  
6.     {  
7.         Ext.Msg.alert(this.getName());  
8.     }  
9. }  
10. )  

 

应该看得懂吧，Person类继承了Animal类，然后覆盖了speak这个方法。

完整的的如下：

 

Java代码  

1. Ext.application(  
2. {  
3.     name:"sencha",  
4.     launch:function()  
5.     {  
6.         var my=Ext.create("Person",{name:"bob"})  
7.         my.setName("haha");  
8.         my.speak();  
9.     }  
10. }  
11. )  
12.   
13. Ext.define(  
14. "Animal",  
15. {  
16.     config:  
17.     {  
18.         name:null  
19.     },  
20.     constructor:function(config)  
21.     {  
22.         this.initConfig(config);  
23.     },  
24.     speak:function()  
25.     {  
26.         Ext.Msg.alert("123");  
27.     }  
28. }  
29. )  
30. Ext.define(  
31. "Person",  
32. {  
33.     extend:"Animal",  
34.     speak:function()  
35.     {  
36.         Ext.Msg.alert(this.getName());  
37.     }  
38. }  
39. )  

 他会弹出"haha"这个字符串。呵呵  写好了