首页 | 新闻 | 新品 | 文库 | 方案 | 视频 | 下载 | 商城 | 开发板 | 数据中心 | 座谈新版 | 培训 | 工具 | 博客 | 论坛 | 百科 | GEC | 活动 | 主题月 | 电子展
返回列表 回复 发帖

用 JSON 处理缓存(3)

用 JSON 处理缓存(3)

扩展客户端数据缓存某些 Web 应用程序要求用户为同一个属性或对象输入多个数据。例如,person-vehicle 要求人员为其拥有的每台车辆都输入数据。如果此人拥有多台车辆,应用程序必须允许输入多台车辆的数据。我将把此类对象作为一个 多组属性 来引用。如果多组属性包含任何可以保存多个数据实例的属性,我将称之为 多值属性
现在,多组属性和多值属性面临的问题是必须将数据输入到相同的输入字段中。那意味着在输入第二台车辆的数据之前,必须先保存已输入的第一台车辆的数据。您可以通过两种方法来解决此问题:
  • 将第一台车辆的数据发送到服务器上并清空输入字段,以允许用户输入下一台车辆的数据。
  • 将数据缓存到客户机上并清空输入字段,以允许用户输入下一台车辆的数据。
第一种方法存在的问题是每输入一台车辆的数据就需要访问一次服务器。这不太好;如果在输入车辆数据后都必须等待服务器响应,用户会觉得很失望。换种方法,第二种方法的响应时间几乎为零。用户可以快速输入所有车辆数据而无需等待。但这里需要考虑的是如何将数据存储到客户端上。这里有更多方法可将数据存储到客户机上:
  • 在用户单击以添加下一台车辆的数据时将数据以某种形式缓存到隐藏的表字段中。
  • 将数据缓存到一个 JavaScript 对象中。
如果要将数据存储到隐藏字段中,您会为用户每次输入新的车辆数据都要处理很多隐藏字段或处理隐藏字段数据而感到烦恼。这就像有字符串操作就需要频繁处理字符串一样。
但是第二种缓存数据的方法提供了一种面向对象的方法来缓存。当用户输入新车辆数据时,您将在数组对象中创建一个新元素。不需要任何笨拙的字符串操作。当用户输完所有车辆数据后,您只需构建一个源于该对象的 JSON 字符串,并通过存储到某个隐藏字段中的方式将该字符串发送至服务器。这种方法要比第一种方法好得多。
JSON、数据缓存和 Ajax 功能当使用 JSON 将数据缓存到客户端时,系统将在用户每次单击 Add Vehicle 按钮时更新数据缓存对象。用于完成此项任务的 JavaScript 函数看起来可能跟  一样。
清单 5. 用于将车辆数据添加到 JavaScript 对象中以进行客户端缓存的函数
1
2
3
4
5
6
7
8
9
function addVehicleData() {
     var brand = //get vehicle brand;<br>   var regNo = //get registration number;
      var cc = //get cc;

      vehicleData[vehicleData.length] = new Object();
    vehicleData[vehicleData.length].brandName = new Object();
  vehicleData[vehicleData.length].brandName = brand;
   //same way update other two properties
}




在这里,vehicleData 是用于在用户装入页面时进行初始化的 JavaScript 变量。它被初始化为一个新的数组对象,该数组对象为空或者含有用户先前输入的车辆的车辆元素。
当此函数将数据保存到 JavaScript 对象中后,程序可以调用另一个函数来清空输入字段以允许用户输入新数据。
在此类应用程序中,要求用户输入出现次数最少或出现次数最多的多组或多值属性。您可以将这些限制置入 JSON 元数据对象中。在这种情况下,先前的元数据对象将变为  中所示的代码。
清单 6. 带有出现次数限制的 JSON 元数据对象
1
2
3
4
5
6
7
var vehicleValidationsMetadata = {
     "MIN_OCC":{0},
     "MAX_OCC":{10},
     "MAX_OCC_MSG":{"...."},
     "MIN_OCC_MSG":{".....},
     //Everything else is the same
}




然后,addVehicleData() 函数将先验证数据的出现次数,然后在仅当总出现次数未超出允许的限制时再将数据添加到 JavaScript 对象中。 显示了检查方法。
清单 7. JSON 元数据对象限制检查
1
2
3
4
5
function addVehicleData() {
   if(vehicleData.length == vehicleValidationsMetadata.MAX_OCC-1) {
          alert(vehicleValidationsMetadata.MAX_OCC_MSG);
     }<br>  //Everything else is the same
}




当用户提交一个页面时调用的函数实际上用于验证最少的出现次数。这种方法的最大好处是屏幕不需要刷新以输入新车辆数据。提供此类静态屏幕曾经是 Ajax 技术的主要目标,而您现在用 JSON 也能完成此目标。这是关于更新 JSON 数据对象和通过 JavaScript 处理 HTML DOM 树的全部内容。用户响应时间是最小值,因为所有操作仅在客户端上执行。您可以使用 JSON 来为应用程序提供 Ajax 功能。
当用户单击 Save 按钮时,程序将调用另一个 JavaScript 函数,该函数将把此 JSON 对象 字符串化 并将其存储到程序提交到服务器上的隐藏表字段中。JSON.js(请参阅 )有一个 JSON.stringify() 函数,该函数将获取 JavaScript 对象作为输入并返回字符串输出。
服务器端必须能够理解 JSON 形式的字符串并生成一个服务器端对象,以处理和保存数据。Web 站点 http://www.json.org/java/index.html 提供了一个 Java API,该 API 用于处理基于 Java 的应用程序的大部分需求。
返回列表