全部 / 前端 / 技术 · 2022年7月5日 0

57 – JavaScript 中的缓存

原文地址:https://dev.to/bhagatparwinder/memoization-in-javascript-2ncl

JavaScript和函数式编程携手并进。有些时候,我们的功能将会付出高昂的性能代价。一直执行同样的函数接受同样的参数会降低应用的性能并且这也没有比较。

缓存是一种优化技术,用来保存我们函数返回的结果。如果我们向同一个函数输入相同的参数,我们就可以从缓存中获取结果而不是从执行代码获取,那样会导致性能问题。

万一结果没有被命中,我们将会执行函数且缓存结果。让我们以计算一个数的平方为例:

const square = () => {
    let cache = {}; // set cache
    return (value) => {
        // if exists in cache return from cache
        if (value in cache) {
            console.log("Fetching from cache");
            return cache[value];
        } else {
            // If not in cache perform operation
            console.log("Performing expensive query");
            const result = value * value;
            cache[value] = result; // store the value in cache
            return result; // return result
        }
    }
}

const sq = square();
console.log(sq(21)); // Performing expensive query, 441
console.log(sq(21)); // Fetching from cache, 441

为什么以及何时使用它?

  • 用于耗时的函数调用,例如:一个函数调用了网络且返回结果不会改变或需要大量计算的函数或硬盘读写。
  • 用于纯函数(同样的输入相同的输出)。
  • 用于有限的输入但值高度重复的函数调用。