防止重新執行已使用相同參數處理過一次的大型 JavaScript 函數。-js教程-PHP中文網

防止重新執行已使用相同參數處理過一次的大型 JavaScript 函數。

WBOY

發布： 2024-08-28 06:08:06

原創

544 人瀏覽過

Prevents re-execution of large javascript functions that have been processed once with the same parameter.

記憶法

使用相同參數執行的函數的快取機制（memoizer）（僅 1.14 KB）

專案提供了 memoize 函數，透過快取昂貴的函數呼叫結果來提高 JavaScript 或 TypeScript 專案的效能。透過記憶，使用相同參數重複呼叫將傳回快取的結果，從而加快執行速度。

這個模組的工作原理類似於 React 的 useMemo hook，但不需要 React。您可以使用任何框架或純 javascript 專案

Npm 包
GitHub

特徵

函數記憶：快取具有相同參數的函數呼叫結果。
依賴項追蹤：如果依賴項發生變化，則更新快取。
彈性：可用於 JavaScript 和 TypeScript 專案。
CPU密集型運算或複雜計算的最佳解決方案
斷開連接的函數將從記憶體中刪除。屬於該函數的快取也會被刪除。
基於WeakMap的快取儲存
WeakMap 斷開無法與弱引用連結通訊的方法，並觸發垃圾收集器啟動

使用案例

沒有 deps 參數

在下面的過程中，當使用相同的參數再次呼叫 concatPhoneNumber 方法時，函數不會再次執行，而是從快取中取得結果。

import memofy from "memofy";

const concatPhoneNumber = (extension, number) => {
  // Heavy calculation
  // return result
};

const memoizedConcatPhoneNumber = memofy(concatPhoneNumber, []);

memoizedConcatPhoneNumber(90, 555); // Runs concatPhoneNumber when first run
memoizedConcatPhoneNumber(90, 555); // get value from cache

memoizedConcatPhoneNumber(90, 552); // Runs concatPhoneNumber because params is change

登入後複製

帶 deps 參數

如果您希望方法根據某些依賴關係以相同的參數再次運行，可以如下傳遞 deps 參數。

import memofy from "memofy";

const taxRatio = 0.5;
const product = { title: "Test product", price: 10 };

const calculateTax = () => {
  // Calculate tax by product price
  // Heavy calculation
  return taxRatio * product.price;
};

const memoizedConcatPhoneNumber = memofy(calculateTax, [product, taxRatio]);

calculatedPrice = calculateTax(); // Runs concatPhoneNumber when first run

product.price = 40;
let calculatedPrice = calculateTax(); // Runs concatPhoneNumber because product dep changed

taxRatio = 0.8;
calculatedPrice = calculateTax(); // Runs concatPhoneNumber because taxRatio changed

登入後複製