JS 实现缓存算法的示例(FIFO/LRU)


Posted in Javascript onMarch 20, 2018

FIFO

最简单的一种缓存算法,设置缓存上限,当达到了缓存上限的时候,按照先进先出的策略进行淘汰,再增加进新的 k-v 。

使用了一个对象作为缓存,一个数组配合着记录添加进对象时的顺序,判断是否到达上限,若到达上限取数组中的第一个元素key,对应删除对象中的键值。

/**
 * FIFO队列算法实现缓存
 * 需要一个对象和一个数组作为辅助
 * 数组记录进入顺序
 */
class FifoCache{
  constructor(limit){
    this.limit = limit || 10
    this.map = {}
    this.keys = []
  }
  set(key,value){
    let map = this.map
    let keys = this.keys
    if (!Object.prototype.hasOwnProperty.call(map,key)) {
      if (keys.length === this.limit) {
        delete map[keys.shift()]//先进先出,删除队列第一个元素
      }
      keys.push(key)
    }
    map[key] = value//无论存在与否都对map中的key赋值
  }
  get(key){
    return this.map[key]
  }
}

module.exports = FifoCache

LRU

LRU(Least recently used,最近最少使用)算法。该算法的观点是,最近被访问的数据那么它将来访问的概率就大,缓存满的时候,优先淘汰最无人问津者。

算法实现思路:基于一个双链表的数据结构,在没有满员的情况下,新来的 k-v 放在链表的头部,以后每次获取缓存中的 k-v 时就将该k-v移到最前面,缓存满的时候优先淘汰末尾的。

双向链表的特点,具有头尾指针,每个节点都有 prev(前驱) 和 next(后继) 指针分别指向他的前一个和后一个节点。

关键点:在双链表的插入过程中要注意顺序问题,一定是在保持链表不断的情况下先处理指针,最后才将原头指针指向新插入的元素,在代码的实现中请注意看我在注释中说明的顺序注意点!

class LruCache {
  constructor(limit) {
    this.limit = limit || 10
    //head 指针指向表头元素,即为最常用的元素
    this.head = this.tail = undefined
    this.map = {}
    this.size = 0
  }
  get(key, IfreturnNode) {
    let node = this.map[key]
    // 如果查找不到含有`key`这个属性的缓存对象
    if (node === undefined) return
    // 如果查找到的缓存对象已经是 tail (最近使用过的)
    if (node === this.head) { //判断该节点是不是是第一个节点
      // 是的话,皆大欢喜,不用移动元素,直接返回
      return returnnode ?
        node :
        node.value
    }
    // 不是头结点,铁定要移动元素了
    if (node.prev) { //首先要判断该节点是不是有前驱
      if (node === this.tail) { //有前驱,若是尾节点的话多一步,让尾指针指向当前节点的前驱
        this.tail = node.prev
      }
      //把当前节点的后继交接给当前节点的前驱去指向。
      node.prev.next = node.next
    }
    if (node.next) { //判断该节点是不是有后继
      //有后继的话直接让后继的前驱指向当前节点的前驱
      node.next.prev = node.prev
      //整个一个过程就是把当前节点拿出来,并且保证链表不断,下面开始移动当前节点了
    }
    node.prev = undefined //移动到最前面,所以没了前驱
    node.next = this.head //注意!!! 这里要先把之前的排头给接到手!!!!让当前节点的后继指向原排头
    if (this.head) {
      this.head.prev = node //让之前的排头的前驱指向现在的节点
    }
    this.head = node //完成了交接,才能执行此步!不然就找不到之前的排头啦!
    return IfreturnNode ?
      node :
      node.value
  }
  set(key, value) {
    // 之前的算法可以直接存k-v但是现在要把简单的 k-v 封装成一个满足双链表的节点
    //1.查看是否已经有了该节点
    let node = this.get(key, true)
    if (!node) {
      if (this.size === this.limit) { //判断缓存是否达到上限
        //达到了,要删最后一个节点了。
        if (this.tail) {
          this.tail = this.tail.prev
          this.tail.prev.next = undefined
          //平滑断链之后,销毁当前节点
          this.tail.prev = this.tail.next = undefined
          this.map[this.tail.key] = undefined
          //当前缓存内存释放一个槽位
          this.size--
        }
        node = {
          key: key
        }
        this.map[key] = node
        if(this.head){//判断缓存里面是不是有节点
          this.head.prev = node
          node.next = this.head
        }else{
          //缓存里没有值,皆大欢喜,直接让head指向新节点就行了
          this.head = node
          this.tail = node
        }
        this.size++//减少一个缓存槽位
      }
    }
    //节点存不存在都要给他重新赋值啊
    node.value = value
  }
}

module.exports = LruCache

具体的思路就是如果所要get的节点不是头结点(即已经是最近使用的节点了,不需要移动节点位置)要先进行平滑的断链操作,处理好指针指向的关系,拿出需要移动到最前面的节点,进行链表的插入操作。

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

Javascript 相关文章推荐
javascript Keycode对照表
Oct 24 Javascript
基于jquery的图片的切换(以数字的形式)
Feb 14 Javascript
自己写的兼容ie和ff的在线文本编辑器类似ewebeditor
Dec 12 Javascript
js实现密码强度检测【附示例】
Mar 30 Javascript
jQuery复合事件结合toggle()方法的用法示例
Jun 10 jQuery
浅谈Vuex的状态管理(全家桶)
Nov 04 Javascript
ndm:NPM的桌面GUI应用程序
Oct 15 Javascript
JSON是什么?有哪些优点?JSON和XML的区别?
Apr 29 Javascript
Javascript和jquery在selenium的使用过程
Oct 31 jQuery
js实现批量删除功能
Aug 27 Javascript
Vue 防止短时间内连续点击后多次触发请求的操作
Nov 11 Javascript
Vue+element-ui添加自定义右键菜单的方法示例
Dec 08 Vue.js
react-native封装插件swiper的使用方法
Mar 20 #Javascript
在vue项目中使用sass的配置方法
Mar 20 #Javascript
webpack vue项目开发环境局域网访问方法
Mar 20 #Javascript
动态加载、移除js/css文件的示例代码
Mar 20 #Javascript
webpack 打包压缩js和css的方法示例
Mar 20 #Javascript
浅谈Node 调试工具入门教程
Mar 20 #Javascript
使用Vue.js开发微信小程序开源框架mpvue解析
Mar 20 #Javascript
You might like
重量级动漫纷纷停播!唯独OVERLORD第四季正在英魂之刃继续更新
2020/05/06 日漫
php !function_exists("T7FC56270E7A70FA81A5935B72EACBE29"))代码解密
2011/01/07 PHP
php模拟asp中的XmlHttpRequest实现http请求的代码
2011/03/24 PHP
PHP实现批量检测网站是否能够正常打开的方法
2016/08/23 PHP
PHP数字金额转换成中文大写显示
2019/01/05 PHP
JavaScript 继承使用分析
2011/05/12 Javascript
javascript 正则表达式相关应介绍
2012/11/27 Javascript
关于JS字符串函数String.replace()
2013/04/07 Javascript
javascript文本框内输入文字倒计数的方法
2015/02/24 Javascript
Jsonp post 跨域方案
2015/07/06 Javascript
Angular2 (RC4) 路由与导航详解
2016/09/21 Javascript
javascript 封装Date日期类实例详解
2017/05/28 Javascript
解决vue 格式化银行卡(信用卡)每4位一个符号隔断的问题
2018/09/14 Javascript
JS使用对象的defineProperty进行变量监控操作示例
2019/02/02 Javascript
微信小程序如何播放腾讯视频的实现
2019/09/20 Javascript
详解Vscode中使用Eslint终极配置大全
2019/11/08 Javascript
js获取本日、本周、本月的时间代码
2020/02/01 Javascript
[02:23]2014DOTA2国际邀请赛中国战队回顾
2014/08/01 DOTA
Python中删除文件的程序代码
2011/03/13 Python
Python实现命令行通讯录实例教程
2016/08/18 Python
Python实现的弹球小游戏示例
2017/08/01 Python
Python基于FTP模块实现ftp文件上传操作示例
2018/04/23 Python
Python基于lxml模块解析html获取页面内所有叶子节点xpath路径功能示例
2018/05/16 Python
Python爬虫实现(伪)球迷速成
2018/06/10 Python
python删除列表元素的三种方法(remove,pop,del)
2019/07/22 Python
Python一键查找iOS项目中未使用的图片、音频、视频资源
2019/08/12 Python
Python如何使用字符打印照片
2020/01/03 Python
python代码xml转txt实例
2020/03/10 Python
中国海淘族值得信赖的海淘返利网站:55海淘
2017/01/16 全球购物
外贸实习生自荐信范文
2013/11/24 职场文书
坚守艰苦奋斗精神坚决反对享乐主义整改措施
2014/09/17 职场文书
公安四风对照检查材料思想汇报
2014/10/11 职场文书
如何理解python接口自动化之logging日志模块
2021/06/15 Python
Python函数中的不定长参数相关知识总结
2021/06/24 Python
Spring Boot DevTools 全局配置学习指南
2022/03/31 Java/Android
Pandas实现批量拆分与合并Excel的示例代码
2022/05/30 Python