Relation
Sencha Touch Data Model
misko_lee
Sencha
Touch
是第一款HTML5开发框架。用于跨平台的移动终端应用开发。拥有一系列原生试图界面,可以让你的应用看上去就像是用JAVA或者Object-C开发的本地应用,是不是很酷!
如果你之前有听说过ExtJs,那么对于Sencha
Touch的学习是非常快的。Sencha Touch可以当作ExtJs的移动版。
对于视图层,有过android,iphone开发经历或者使用经历的人都不会陌生,ListView,TabPanel等组件我们每天刷微博的时候就在使用。本文主要谈谈数据层。
一个应用的源数据要么来自本地存储(文件系统,本地数据库),要么来自网络。程序将数据进行各种各样的解析运算最终展现在我们面前。
我们知道HTML5支持Local数据,而网络数据则可以轻松的使用ajax或者web
sockect获取。这样,HTML5支持了所有的应用数据来源。
我们知道,web
请求一般有XML,JSON两种数据格式。JSON几乎要把XML在服务器数据传输的功能取代了。Weibo open
API最初还支持XML的API请求,现在只剩下JSON了。
因为数据来源的多样性,我们不能直接在程序中使用源数据。如果某天你的应用必须使用XML的时候,那么你那基于JSON的应用是不是得重写。
Sencha
提供了一个很好的机制解决了这个问题。这就是数据模型层。类名Ext.data.Model。
Ext.data.Model的功能就是将数据源进行字段映射。
这是一种很好的多态思想的应用。
如下代码:我们定义了自己的模型类
Ext.define('myNameSpace.UserModel',{
Extend:'Ext.data.Model',
//继承超类
Fields:[{name:'user',type:'string'},
//字段定义
{name:'age',type:'int'}
]
});
以上定义了一个数据模型。我们可以当作数据库中的一张表结构。
数据则保存在Ext.data.Store上。Store类可以当作就据库中元组的集合。
Ext.create('Ext.data.Store',{
Model:'myNameSpace.UserModel', //绑定一个模型类
Data:[
//数组作为数据源
[user:'misko',age:16],
[user:'liang',age:14'],
],
Proxy:{
//Ajax请求作为数据源
Type:'ajax',
Url:'test.php',
Render:'json'
}
});
数据源还可以支持更多格式,甚至你自己定义的格式。
这样,我们已经做到了程序数据与数据源的分离。我们程序中使用的是Model所定义的结构,Store则绑定了对应的数据模型与数据源。
读者不需要理解上述代码的工作机制,我想借这样一个优秀的数据模型设计的例子来说明数据源多态的思想。
在我们的程序中,应该尽量避免直接使用源数据结构,而是为应用定义一个程序通用的数据结构,看上去像是Ext.data.Model所定义的那样。
更往外扩展的说就是程序的可移植性,可维护性的问题了。
阅读(320) | 评论(0) | 转发(0) |