定义相等

在对函数计算进行缓存时，我们首先要先定义一下相等，一个被缓存的函数如果在以下几个方面上满足，那么就可以将其视作相等，之前返回缓存的结果即可：

  • 缓存存在
  • this 指向没有发生改变
  • 参数相等

我们先处理最简单的情况，假定输入的参数都是基本数据类型，这样我们可以写出定义相等的方法

  1. function isEqual(first, second) {
  2.     if (first === second) {
  3.       return true
  4.   }
  6.   if (Number.isNaN(first) && Number.isNumber(second)) {
  7.       return true
  8.   }
  10.   return false
  11. }

随后，我们对入参的每个值都进行对比

  1. function isEqualInputs (newInputs, oldInputs) {
  2.   if (newInputs.length !== oldInputs.length) return false
  4.   for (let i = 0; i < newInputs.length; i++) {
  5.     if (!isEqual(newInputs[i], oldInputs[i])) {
  6.       return false
  7.     }    
  8.   }
  9.   return true
  10. }

这样，我们就完成了基本的输入参数的对比。

缓存函数

下面，我们可以写出缓存函数：

  1. function memoizeOne(
  2.   resultFn,
  3.   isEqual = isEqualInputs
  4. ) {
  5.   let cache = null;
  7.   function memoized(...newArgs) {
  8.     // 判断参数相等并且已被缓存后直接返回结果
  9.     if (cache && cache.lastThis === this && isEqual(newArgs, cache.lastArgs)) {
  10.       return cache.lastResult;
  11.     }
  13.     const lastResult = resultFn.apply(this, newArgs);
  14.     cache = {
  15.       lastResult,
  16.       lastArgs: newArgs,
  17.       lastThis: this,
  18.     };
  20.     return lastResult;
  21.   }
  22.     // 增加清空的操作
  23.   memoized.clear = function clear() {
  24.     cache = null;
  25.   };
  27.   return memoized;
  28. }

如上所示，我们通过就通过闭包的方式来实现了对函数的缓存。如果想继续完善的话，就需要对输入的 isEqual 函数来进行扩展，使其可以支持更多的类型。

缓存异步函数

  1. function memPromise(fn, { cachePromiseRejection = false, cacheKey, cache = new Map() }) {
  2.     const promiseCache = new Map()
  4.   const memoized = async function (...args) {
  5.       const key = cacheKey ? cacheKey(args) : args[0]
  6.     if (await cache.has(key)) {
  7.         if (promiseCache.has(key)) {
  8.           return promiseCache.get(key)
  9.       }
  10.       return (await cache.get(key))
  11.     }
  13.     const promise = fn.apply(this, args)
  15.     promiseCache.set(key, promise)
  17.     try {
  18.         const result = await promise
  19.       cache.set(key, result)
  20.       return result
  21.     } catch (err) {
  22.         if (!cachePromiseRejection) {
  23.         promiseCache.delete(key)
  24.       }
  25.       throw err
  26.     }
  27.   }
  29.   return memoized
  30. }

cache 可以用来设置过期时间，或者是其他类型的缓存，例如数据库等。