AngularJS中的缓存使用


Posted in Javascript onJanuary 11, 2017

缓存篇

一个缓存就是一个组件,它可以透明地储存数据,以便以后可以更快地服务于请求。多次重复地获取资源可能会导致数据重复,消耗时间。因此缓存适用于变化性不大的一些数据,缓存能够服务的请求越多,整体系统性能就能提升越多。

$cacheFactory与缓存对象

$cacheFactory是一个为Angular服务生产缓存对象的服务。要创建一个缓存对象,可以使用$cacheFactory通过一个ID和capacity。其中,ID是一个缓存对象的名称,capacity则是描述缓存键值对的最大数量。举个生动的例子,$cacheFactory就是包租婆,她有一栋楼,里面有大大小小的房子可以出租,只要你给够钱,包租婆就会把房子租给你(获得缓存对象),这个房子包括了它的房号(ID)和房间的大小(capacity-容量)。

var myCache = $cacheFactory('myCache');

其中,缓存对象拥有以下几种方法

1. myCache.info() 返回缓存对象的ID,尺寸和选项

2. myCache.put() 新值键值对并放入缓存对象中 myCache.put("name", "Ben")

3. myCache.get() 返回对应的缓存值,若没有找到则返回undefined myCache.get("name")

4. myCache.remove() 把键值对从对应缓存对象中移除 myCache.remove("name")

5. myCache.remvoeAll() 清空该缓存对象

$http中的缓存

$http()方法允许我们传递一个cache参数。当数据不会经常改变的时候,默认的$http缓存会特别有用。其中,默认的$http缓存对象是 var cache = $cacheFactory('$http'); 可以这样设置它

$http({
   method: 'GET',
   url: 'api/user.json',
   cache: true
})

其中,缓存的键值为url, var userCache = cache.get('api/user.json')

自定义缓存

通过自定义的缓存来让$http发起请求也很简单,只需把cache值设为对应缓存对象名称即可

$http({
   method: 'GET',
   url: 'api/user.json',
   cache: myCache
})

或者通过config配置来设置每个$http请求的缓存对象,而不必像上面的例子中,往每一个$http请求中加入配置

app.config(function($httpProvider){
$httpProvider.defaults.cache = $cacheFactory('myCache',{capacity: 20})

其中,capacity会使用"近期缓存最久未使用算法",就是说,加如缓存容量为20,现在已经缓存了缓存20个,当第21个想要被缓存的时候,最久最小未被使用的缓存键值对会被清除,以便腾出空间容纳第21个缓存。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
不同Jquery版本引发的问题解决
Oct 14 Javascript
a标签的href与onclick事件的区别详解
Nov 12 Javascript
Javascript中的五种数据类型详解
Dec 26 Javascript
JavaScript中使用Math.PI圆周率属性的方法
Jun 14 Javascript
理解javascript正则表达式
Mar 08 Javascript
Angular使用动态加载组件方法实现Dialog的示例
May 11 Javascript
js实现同一个页面,多个enter事件绑定的示例
Oct 10 Javascript
react写一个select组件的实现代码
Apr 03 Javascript
layui实现数据表格table分页功能(ajax异步)
Jul 27 Javascript
SSM+layUI 根据登录信息显示不同的页面方法
Sep 20 Javascript
JS继承定义与使用方法简单示例
Feb 19 Javascript
解决Vue的文本编辑器 vue-quill-editor 小图标样式排布错乱问题
Aug 03 Javascript
AngularJS中的按需加载ocLazyLoad示例
Jan 11 #Javascript
ajax的分页查询示例(不刷新页面)
Jan 11 #Javascript
JavaScript实现大图轮播效果
Jan 11 #Javascript
微信小程序 特效菜单抽屉效果实例代码
Jan 11 #Javascript
canvas 弹幕效果(实例分享)
Jan 11 #Javascript
JQuery实现动态操作表格
Jan 11 #Javascript
js如何判断是否在iframe中及防止网页被别站用iframe嵌套
Jan 11 #Javascript
You might like
php microtime获取浮点的时间戳
2010/02/21 PHP
深入理解PHP原理之异常机制
2010/08/21 PHP
php修改指定文件后缀的方法
2014/09/11 PHP
利用PHP如何实现Socket服务器
2015/09/23 PHP
学习php设计模式 php实现命令模式(command)
2015/12/08 PHP
浅谈PHP值mysql操作类
2016/06/29 PHP
php使用PDO执行SQL语句的方法分析
2017/02/16 PHP
php使用mysqli和pdo扩展,测试对比mysql数据库的执行效率完整示例
2019/05/09 PHP
javascript 鼠标滚轮事件
2009/04/09 Javascript
Extjs ajax同步请求时post方式参数发送方式
2009/08/05 Javascript
JavaScript常用的弹出广告及背投广告实现方法
2015/02/06 Javascript
jQuery实现当前页面标签高亮显示的方法
2015/03/10 Javascript
JS实现生成会变大变小的圆环实例
2015/08/05 Javascript
js当前页面登录注册框,固定div,底层阴影的实例代码
2016/10/04 Javascript
js 提交form表单和设置form表单请求路径的实现方法
2016/10/25 Javascript
canvas绘制表盘时钟
2017/01/23 Javascript
vue.js的安装方法
2017/05/12 Javascript
详解angular ui-grid之过滤器设置
2017/06/07 Javascript
JS非空验证及邮箱验证的实例
2017/08/11 Javascript
详解vue2.0 使用动态组件实现 Tab 标签页切换效果(vue-cli)
2017/08/30 Javascript
Vue通过URL传参如何控制全局console.log的开关详解
2017/12/07 Javascript
微信小程序开发之改变data中数组或对象的某一属性值
2018/07/05 Javascript
Python实现的寻找前5个默尼森数算法示例
2018/03/25 Python
python3实现字符串的全排列的方法(无重复字符)
2018/07/07 Python
python游戏开发之视频转彩色字符动画
2019/04/26 Python
Windows系统Python直接调用C++ DLL的方法
2019/08/01 Python
python matplotlib:plt.scatter() 大小和颜色参数详解
2020/04/14 Python
Tensorflow tf.nn.depthwise_conv2d如何实现深度卷积的
2020/04/20 Python
python 使用三引号时容易犯的小错误
2020/10/21 Python
初中考试作弊检讨书
2014/02/01 职场文书
乡镇党的群众路线教育实践活动剖析材料
2014/10/09 职场文书
考博导师推荐信范文
2015/03/27 职场文书
2015年助理工程师工作总结
2015/04/03 职场文书
2019最新企业员工考勤管理制度(通用版)!
2019/07/02 职场文书
电脑关机速度很慢怎么办 提升电脑关机速度设置教程
2022/04/08 数码科技
SQL Server 中的事务介绍
2022/05/20 SQL Server