javascript优化_javascript记忆优化技术

javascript优化

Javascript记忆化： (Javascript Memoization:)

Memoization is a programming technique in which expensive function calls are cached such that their repeated usage can be served from the cache instead of running the function again and again. An expensive function is considered a function that takes some significant amount of computation time. Memoization is especially useful with recursive function calls in which the same function is repeatedly called with the same arguments. The cost of the recursive function increase with the input value sometimes, and the memoization technique can save a lot of time. Since the output of the calculation is the same, it can be cached and returned directly instead of calculating.

记忆化是一种编程技术，其中缓存了昂贵的函数调用，以便可以从缓存中为它们的重复使用提供服务，而不必一次又一次地运行该函数。 昂贵的函数被认为是需要花费大量计算时间的函数。 记忆对于递归函数调用特别有用，在递归函数调用中，使用相同的参数重复调用同一函数。 递归函数的成本有时会随着输入值的增加而增加，并且记忆技术可以节省大量时间。 由于计算的输出是相同的，因此可以将其缓存并直接返回而不是进行计算。

In simple words, memoization is a technique used to reduce repetitive computations. Consider the factorial function implemented using recursion:

简而言之， 记忆是一种用于减少重复计算的技术。 考虑使用递归实现的阶乘函数：

function factorial(n) {
    if(n === 1) return 1;
    return n * factorial(n-1);
}

If we want to compute factorial(3), it would internally call factorial(2) and factorial(1). If these values were already stored, we could easily return it from the cache. The real value of memoization is realized when we compute factorial(25). Instead of running factorial function 24 times, we could return factorial(24) stored in memoize function and save the computing time.

如果我们要计算factorial(3) ，它将在内部调用factorial(2)和factorial(1) 。 如果这些值已经存储，我们可以轻松地从缓存中将其返回。 当我们计算factorial(25)时，便会实现备忘录的真正价值。 代替24次运行阶乘函数，我们可以返回存储在备忘录函数中的factorial(24)并节省计算时间。

Before understanding how to implement memoize, one should be familiar with javascript closures and higher-order functions.

在理解如何实现记忆之前，应该熟悉javascript 闭包和高阶函数。

记忆示例 (Memoize example)

A memoize function makes use of the concept of higher-order functions and closures to accept the base function, cache its value, and return the results.

备忘录函数利用高阶函数和闭包的概念来接受基本函数，缓存其值并返回结果。

Consider the following function:

考虑以下功能：

function memoize(recursiveFunction) {
    var cache = {};
    return function() {
        var key = JSON.stringify(arguments);
        if(cache[key]) {
            return cache[key];
        }
        else {
            var val = recursiveFunction.apply(this, arguments);
            cache[key] = val;
            return val;
        }

We can memoize the factorial function using the following code:

我们可以使用以下代码来记录阶乘函数：

var factorial = memoize(function(n) {
    console.log("computing factorial of: ", n);
    if(n === 1) return 1;
    return n * factorial(n-1);
});
console.log("output - ", factorial(3)); 
// computing factorial of: 3
// computing factorial of: 2
// computing factorial of: 1
// output - 6
console.log("output - ", factorial(3));
// output - 6
console.log("output - ", factorial(5));
// computing factorial of: 5
// computing factorial of: 4
// output - 120

Let’s go through each part of the memoize function and understand what’s happening.

让我们遍历备忘录功能的每个部分，了解正在发生的事情。

1. Memoize function is a higher-order function that takes in the recursive function to be memoized as an argument.

   记忆功能是一个高阶函数，它采用递归函数作为参数来记忆。

2. A cache is initialized inside the memoize function, this cache is an object and hence it would hold key-value pairs.
   缓存在memoize函数内部被初始化，该缓存是一个对象，因此它将保存键值对。
3. A closure function is created that holds the logic for implementing the caching technique.
   创建一个关闭函数，其中包含用于实现缓存技术的逻辑。

4. The first part of the function computes the key and checks if the cache object holds the value for the given key. If the value exists, it is returned and the function exits.

   该函数的第一部分计算key并检查缓存对象是否保存给定key的值。 如果该值存在，则将其返回并退出该函数。

5. The second part of the function executes the actual recursive function and stores its output in the cache with the computed key.

   函数的第二部分执行实际的递归函数，并使用计算出的key将其输出存储在缓存中。

6. The closure function holding the logic for the caching technique is returned.
   返回具有缓存技术逻辑的闭包函数。
7. The memoized function can be now used to get the results in an optimized way.
   现在可以使用备忘录功能以优化的方式获取结果。

Note that memoization is only creating an object and storing the pre-computed values as key-value pairs. However, memoization must be carefully used because it stores large amounts of data. Also note that, if the function executed inside memoization contains the usage of this, its value must be carefully handled. It is best to implement memoization only for pure functions that contain repetitive calculations.

请注意，备忘录只是创建一个对象并将预先计算的值存储为键值对。 但是，由于要存储大量数据，因此必须谨慎使用备忘录。 还要注意，如果在备忘录中执行的函数包含this的用法，则必须小心处理其值。 最好仅对包含重复计算的纯函数实施备忘录。

Originally published at https://aparnajoshi.netlify.app.

最初发布在 https://aparnajoshi.netlify.app上 。

翻译自: https://medium.com/weekly-webtips/javascript-memoization-an-optimization-technique-73e5666bf815

javascript优化