在第一部分和本部分的实现中，最关键的都是那个立即调用的函数表达式，没有它返回的闭包，代码就会有问题，这也是闭包在循环中应用的经典问题。
3. 演示效果
为了说明缓存代理的使用效果，我做了一个演示效果：
其中的ajax.js就是第一部分的实现，ajaxCache.js就是第二部分的实现，演示页面对应代码中的html/demo.html，相关js是js/app/demo.js：
define(function (require, exports, module) { var AjaxCache = require('mod/ajaxCache'); //创建代理对象 var Ajax = new AjaxCache({ cacheInterval: 10 * 1000 }); var count = 5; console.log('时间点：第' + 0 + 's，定时器开始！'); var t = setInterval(function(){ if(count == 0) { console.log('时间点：第' + (5 - count + 1) * 4 + 's，定时器结束！'); return clearInterval(t); } else{ console.log('时间点：第' + (5 - count + 1) * 4 + 's：'); } Ajax.get('../api/data.json', { name: 'felix' }).done(function(res){ if(res.code == 200) { console.log(5 - count + '. data is : ' + JSON.stringify(res.data)); } }); count --; },4000); });
在这个代码中，我创建了一个代理对象，能将ajax请求缓存10s，用一个定时器一共调用代理对象五次get方法来发送同一个请求，最终打印效果如下：
从结果来看，整个代码执行了24s，代理发送请求的时间点分别是第4s，第8s，第12s，第16s和第20s。由于代理的缓存有效时间是10s，且第4s是第一次发送请求，所以此时肯定会发送真实的ajax请求；当第8s和第12s的代理发送同一请求时，由于距离缓存的时间只过去了4s和8s，所以缓存还是有效的，这两个时间点都没有发送实际的ajax请求；但是当第16s的请求发送时，距离第一次请求的缓存时间已经过去12s，缓存已经失效，所以代理又发送了一次真实的ajax请求，然后缓存被刷新；第20s的请求还是在最新的缓存有效时间内，所以也没有发送实际的ajax请求。最后在network中可以看到代理发送了5次请求，但是只请求了2次服务，如果把缓存有效时间延长，就能再减少请求后台的次数，这也是缓存代理对前端性能提升的关键。
希望这个演示效果能够让你更加清楚地了解缓存代理的作用。
4. 本文总结
本文第1部分总结的实现在我自己的工作中应用很多，至少没碰到什么问题，不过也有可能是我没遇到，毕竟那个组件实现还是有不少约束的。第2部分的实现我也是刚刚应用到工作中去，正好有一个功能我考虑到有缓存的必要性，于是就写了一个较为简单的实现，虽然简单，但是已经能解决我的问题了，实际工作本来就是这样，有些东西没必要事无巨细的在事前就设计地很完美，先解决问题，然后在遇到新问题的时候再回来重构，有时也是一种更好的工作方法。下一篇博客介绍另外一个用到缓存代理的组件的实现思路，跟省市级联类似的功能，不过我想的是写成通用性更强的，能够与html结构和css尽可能分离的组件，请您继续关注。