转载请注明出处Ext中文网 （http://www.ajaxjs.com ）。

 

预览ExtJS 4.0的新功能（六）：读写器/Opeartion

许久未更新Blog了，跟大家说声不好意思，要不是工作特忙，以及游戏特吸引人，不然早就写完了，呵呵。当然还离不开夜兄的好言鼓励，一路有大伙总比一个人不知所然强多了。

下面内容大多源自翻译……

Ext.data.Reader

相信我们并不陌生Reader。虽然Ext 4.0的reader依然发挥着它的解析原始数据的职能，主要是转换特定的数据结构，不过由于新加入数据模型的缘故，整体出发仍需要Reader配合。由于新的 需求被提出，Reader也进行了重构，就是今天我们所看到的新Reader类！

Reader负责解析加载到Model或Store的数据，通常值的是AJAX请求完毕后的那些数据。要告诉Reader类怎么工作，实际就是在配置Model或Sotre的时候说明清楚Reader该怎么做。参阅它们的文档或者更好。

Reader可以按照 Ext.data.Association 的定义为每个model所设定的规则读取复杂多层的数据。如下一个例子充分说明了怎么在一个财务CRM中灵活地透析模型与数据之间操作。首先时定义一些模型：

Edit 2011-9-22 示例代码可能与最新版本的 Ext Model 有区别，但不影响主干意思——感谢 Thanks to QiuQiu/太阳。

Ext.regModel("User", { fields: [ 'id', 'name' ], hasMany: {model: 'Order', name: 'orders'}, proxy: { type: 'rest', url : 'users.json', reader: { type: 'json', root: 'users' } }});Ext.regModel("Order", { fields: [ 'id', 'total' ], hasMany : {model: 'OrderItem', name: 'orderItems', associationKey: 'order_items'}, belongsTo: 'User'});Ext.regModel("OrderItem", { fields: [ 'id', 'price', 'quantity', 'order_id', 'product_id' ], belongsTo: ['Order', {model: 'Product', associationKey: 'product'}]});Ext.regModel("Product", { fields: [ 'id', 'name' ], hasMany: 'OrderItem'});

看上去工作量不少，我们只需要知道，用户有许多张订单，其中每张订单有不同的货物组成。它们的实体数据演示如下：

{ "users": [ { "id": 123, "name": "Ed", "orders": [ { "id": 50, "total": 100, "order_items": [ { "id" : 20, "price" : 40, "quantity": 2, "product" : { "id": 1000, "name": "MacBook Pro" } }, { "id" : 21, "price" : 20, "quantity": 3, "product" : { "id": 1001, "name": "iPhone" } } ] } ] } ]}

返回的JSON层数很多，包括有全部用户（出于演示目的暂且一个）以及用户下面的全部订单（演示一个）以及每张订单里面具体有什么货品（演示两个），最后就是Product关联与OrderItem。于是，我们可以这样地读取和使用数据：

var store = new Ext.data.Store({ model: "User"});store.load({ callback: function() { //得到的用户 var user = store.first(); console.log("Orders for " + user.get('name') + ":") //列出用户的订单 user.orders().each(function(order) { console.log("Order ID: " + order.getId() + ", which contains items:"); //列出每张订单的货物 order.orderItems().each(function(orderItem) { // 货品数据已经有了，因此我们可以getProduct同步数据。一般而言我们用异步的版本（请参阅{@link Ext.data.BelongsToAssociation}） var product = orderItem.getProduct(); console.log(orderItem.get('quantity') + ' orders of ' + product.get('name')); }); }); }});

运行上述代码的结果会如下：

Orders for Ed:
Order ID: 50, which contains items:
2 orders of MacBook Pro
3 orders of iPhone

Ext.data.Writer

Writer首次出现在Ext 3.0的API，目的是在针对写操作时，提供一个健全的API。Writer在4.0中得到加强和改善。

客户端如何“写”数据？这里的“写”只是为了方便描述页面上的数据发生了变化，需要保存到服务端的这么一个过程。Ext API中，对应的就有Read 读的这么一个过程。CRUD是一个极简洁的抽象过程，Read/Writer也是抽象出的一种普通动作。Store记录的数据没有被保存的话，仍是客户端上内存反映的数据。我们必须透过一些定义良好的界面类将数据保存到服务端之中、数据库之中。这时Writer就发挥作用了。整体API中，Writer的发生过程与Request、Operation有关。

Writer通常为ServerProxy其子类所使用。该类的作用是让Operation与Ext.data.Request之间产生关系，具体说就是根据Operations修改请求对象。例如 Ext.data.JsonWriter会根据配置项参数格式化操作对象及其Ext.data.Model实例。配置项参数来自哪里？原来是来自JsonWriter的构造器参数。

Writer的关键方法便是write()，该方法接受有一个Request类型对象的参数，实际上是经过Request、Operation对象的records属性，获取到基于JSON结构的记录实体，收集要“写入”的那些数据，然后再通过模板方法getRecordData()转换数据格式，保存到writeRecords()中（writeRecords()也是一个模板方法）。故所以，客户端的数据必须转换为特定的格式发送到服务端的。当前，Writer下面提供了两个子类JsonWriter和XMLWriter，代表可以支持JSON/XML的这两种经典数据格式。

另外一点，Writer终端的服务端对象并不包括LocalStorge本地储存。

Operation

单个Operation类表征了Proxy在进行单个读或者写的时候的具体操作，多个Operation可以批处理为一个Batch（Ext.data.Batch）。Operation对象用于激活Stores和Proxy之间操作，但是必须提出，开发人员通常不会直接和Operation对象打交道，也就是Ext API会内部使用Operation。

转载请注明出处Ext中文网 （http://www.ajaxjs.com）。