JavaScript中如何实现函数缓存,函数缓存有哪些应用场景

函数缓存就是将函数运算的结果进行缓存。

本质上是利用空间换时间。

常用于缓存数据计算结果和缓存对象。缓存只是一个临时的数据存储,它保存数据,为了方便将来对该数据的请求时,可以更快的得到处理。

缓存函数

实现一个缓存函数,主要依靠闭包、柯里化和高阶函数。

闭包:

javascript 复制代码
(function () {
  var a = 1;
  function add() {
    const b = 2
    let sum = b + a
    console.log(sum); // 3
  }
  add()
})()

柯里化:

把接受多个参数的函数转化为接受一个参数的函数。

javascript 复制代码
// 非柯里化函数
var add = function (x, y) {
  return x + y;
}
add(3, 4) //7
// 柯里化函数
var add2 = function (x) {
  //** 返回函数 **
  return function (y) {
    return x + y;
  }
}
add2(3)(4) //7

也就是把一个二元函数拆分为两个一元函数

高阶函数,通过接收其他函数作为参数或者返回其他函数的函数。

缓存函数代码:

javascript 复制代码
const memoize = function (func, content) {
  let cache = Object.create(null)
  content = content || this
  return (...key) => {
    if (!cache[key]) {
      cache[key] = func.apply(content, key)
    }
    return cache[key]
  }
}
  1. 在当前函数作用域内定义一个空对象,用来缓存运行的结果
  2. 使用柯里化返回一个函数,返回的函数由于闭包的特性,可以访问缓存
  3. 然后判断输入参数是不是存在缓存中,如果存在,就直接返回缓存中的数据,如果缓存中不存在,使用函数对输入输入的参数进行运算,然后把结果存储到缓存中。

应用场景

使用缓存的效率是非常高的,但并不是所有的场景中都适用,在这几个场景中,适合使用缓存:

  • 对于昂贵的函数调用,执行复杂计算的函数
  • 对于具有有限并且高度重复输入范围的函数
  • 对于具有重复输入值的递归函数'
  • 对于纯函数,也就是传入任何参数,都返回相同的结果,这时候就适用缓存。
相关推荐
RadiumAg8 分钟前
记一道有趣的面试题
前端·javascript
yangzhi_emo12 分钟前
ES6笔记2
开发语言·前端·javascript
yanlele28 分钟前
我用爬虫抓取了 25 年 5 月掘金热门面试文章
前端·javascript·面试
烛阴2 小时前
void 0 的奥秘:解锁 JavaScript 中 undefined 的正确打开方式
前端·javascript
初遇你时动了情2 小时前
腾讯地图 vue3 使用 封装 地图组件
javascript·vue.js·腾讯地图
dssxyz2 小时前
uniapp打包微信小程序主包过大问题_uniapp 微信小程序时主包太大和vendor.js过大
javascript·微信小程序·uni-app
ohMyGod_1235 小时前
React16,17,18,19新特性更新对比
前端·javascript·react.js
@大迁世界5 小时前
第1章 React组件开发基础
前端·javascript·react.js·前端框架·ecmascript
一瓣橙子5 小时前
7.7日 实验03-Spark批处理开发(2)
开发语言·javascript·ajax
Hilaku5 小时前
从一个实战项目,看懂 `new DataTransfer()` 的三大妙用
前端·javascript·jquery