创建可缓存计算过程的函数

广告位招租
扫码页面底部二维码联系

受reselect启发,实际上,对于某类特定函数——输入相同的情况下,输出一定相同的纯函数,实际上,对于相同的输入参数,没有必要进行多次计算,而是可以将结果缓存起来,在识别到相同的参数时,直接取出该参数对应的结果即可。因此,我编写了computex:

/**
 * 创建一个可缓存的纯函数。
 * 使用场景:纯函数,相同的参数永远得到相同的结果。
 * @param {*} fn 原始纯函数
 * @param {*} expire 缓存过期时间
 * @example
 * const fn = computex((state) => {
 *   return state.name + ':' + state.age
 * })
 * var a1 = fn({})
 * var a2 = fn({})
 * // a1 === a2 // 因为参数相同,所以结果使用了缓存,因此也相同(引用相同)
 */
export function computex(fn, expire = 60000) {
  const cache = {}

  // 创建一个循环任务,检查缓存是否过期,如果过期,则删除缓存,释放内存
  const recycle = () => {
    const keys = Object.keys(cache)
    keys.forEach((key) => {
      const { time } = cache[key]
      if (time + expire <= Date.now()) {
        delete cache[key]
      }
    })
    setTimeout(recycle, 1000)
  }

  // 如果expire设置为0,则缓存永久生效
  if (expire) {
    recycle()
  }

  return function(...args) {
    const hash = getObjectHash(args)
    if (hash in cache) {
      const item = cache[hash]
      return item.result
    }

    const result = fn.apply(this, args)
    const time = Date.now()
    cache[hash] = { result, time }

    return result
  }
}

其中computex本身是一个函数,它接收一个函数,返回一个函数,返回的函数是接收到函数的复刻版,运行它得到的结果和运行传入函数是一样的。这样就可以做到缓存计算过程。

/**
 * 创建一个在同一个同步进程中只获取一次的函数。
 * 使用场景:反复调用一个函数,而该函数在本批次运行时,实际执行结果应该相同。
 * @param {*} fn
 * @param {number} expire 缓存过期时间,根据实际的情况来看,如果一个运算比较大,可以设大一点
 * @example
 * const get = getx(() => Date.now())
 * var a1 = get()
 * var a2 = get()
 * // a1 === a2 // 在同步进程中,直接使用缓存
 */
export function getx(fn, expire = 10) {
  var iscalling = false
  var cache = null
  var timer = null

  return function() {
    clearTimeout(timer)
    timer = setTimeout(() => {
      iscalling = false
      cache = null
    }, expire)

    if (iscalling) {
      return cache
    }

    iscalling = true

    const result = fn.call(this)
    cache = result
    return result
  }
}

getx是另外一个逻辑。当在同一个同步进程中,我们可能会反复调用一个函数,而这些函数在这一次反复调用时,实际上是执行了同一个过程,所以,得到的结果也是一样的,但是在执行过程中消耗了资源。因此,我们可以将这些结果缓存起来,在这一个同步进程结束后再清理掉即可。

/**
 * 创建一个缓存Promise的异步函数
 * @param {*} fn
 * @param {*} expire 缓存的过期时间,不设置的时候,当Promise结束缓存就会被清空,而如果设置了expire,完全按照expire清空缓存,而不会依赖Promise的结束
 */
export function asyncx(fn, expire = 0) {
	const cache = {}

	// 创建一个循环任务,检查缓存是否过期,如果过期,则删除缓存,释放内存
	const recycle = () => {
		const keys = Object.keys(cache)
		keys.forEach((key) => {
			const { time } = cache[key]
			if (time + expire <= Date.now()) {
				delete cache[key]
			}
		})
		setTimeout(recycle, 1000)
	}

	// 如果expire设置为0,则缓存永久生效
	if (expire > 0) {
		recycle()
	}

	return function(...args) {
		const hash = getObjectHash(args)
		if (hash in cache) {
			const item = cache[hash]
			return item.deferer
		}

		const deferer = new Promise((resolve, reject) => {
			Promise.resolve().then(() => fn.apply(this, args)).then(resolve).catch(reject).then(() => {
				if (expire > 0) {
					return
				}
				delete cache[hash]
			})
		})
		const time = Date.now()
		cache[hash] = { deferer, time }

		return deferer
	}
}

而对于基于Promise的异步操作,则通过asyncx来实现缓存。缓存的并非Promise最终返回的结果,而是缓存Promise本身,在一个Promise进行中的时候,如果再次调用这个函数,得到的会是未结束的Promise,而非重新发起一个Promise。这有助于解决短时间内反复请求某个api接口的情况。

已有2条评论
  1. 苦瓜 2019-03-08 21:48

    hello,有个问题要请教一下你,之前你说过网易云的播放器音质挺烂,你说过用了什么耳机再来用苹果的,iphone的音质很差。    我想要你帮我推荐一个手机耳机,或者说是便捷式耳机。不不太想要太大,如果说在体验上很好也是可以接受的。

    一直关注你。

    • 否子戈 2019-03-11 10:15

      谢谢关注,其实我对耳机要求不高,所以没有太多研究。你可以试试airpod,时尚感比较强,如果是追求音质,还是推荐索尼的耳机,如果希望续航长一点,可以考虑项圈的,我买的JBL虽然音质我还觉得不错,但是续航弱。