关于前端:函数缓存

为了讲明确这个概念，假如你在开发一个天气app。开始你不晓得怎么做，正好有一个npm包里有一个getChanceOfRain的办法能够调用：

import { getChangeOfRain } from 'magic-weather-calculator';function showWeatherReport() {  let result = getChangeOfRain();    // 这里调用  console.log('The change of rain tomorrow is: ', result);}

只是这样会遇到一个问题。无论你做什么，只有调用这个办法就会耗费100毫秒。所以，如果某个用户疯狂点击“显示天气”按钮，每次点击app都会有一段时间没有响应。

showWeatherReport(); // 触发计算showWeatherReport(); // 触发计算showWeatherReport(); // 触发计算

这很不感性。在理论开发中，如果你曾经晓得后果了，那么你不会一次一次的计算结果。重用上次的后果才是上佳抉择。这就是函数缓存。函数缓存也就是缓存函数的结算后果，这样就不须要一次一次的调用函数。

在上面的例子里，咱们会调用memoizedGetChangeOfRain()。在这个办法里咱们会检查一下是否曾经有后果了，而不会每次都调用getChangeOfRain()办法：

import { getChangeOfRain } from 'magic-weather-calculator';let isCalculated = false;let lastResult;// 增加这个办法function momoizedGetChangeOfRain() {  if (isCalculated) {    // 不须要在计算一次    return lastResult;  }    // 第一次运行时计算  let result = getChangeOfRain();    lastResult = result;  isCalculated = true;    return result;}function showWeatherReport() {  let result = momoizedGetChangeOfRain();  console.log('The chance of rain tomottow is:', result);}

不过这个也不是没事就要用的。只有在状况容许的时候采纳。而且要确定应用了之后有了性能的显著晋升。

原文地址：https://whatthefork.is/memoiz...