Funktionsoptimierung in JavaScript mit Memoization

JavaScriptJavaScriptBeginner
Jetzt üben

This tutorial is from open-source community. Access the source code

💡 Dieser Artikel wurde von AI-Assistenten übersetzt. Um die englische Version anzuzeigen, können Sie hier klicken

Einführung

In diesem Lab werden wir das Konzept der Memoization in JavaScript erkunden. Memoization ist eine Technik, die verwendet wird, um die Funktionsleistung zu optimieren, indem die Ergebnisse teurer Funktionsaufrufe zwischengespeichert werden und das zwischengespeicherte Ergebnis zurückgegeben wird, wenn die gleichen Eingaben erneut auftauchen. Durch dieses Lab werden wir lernen, wie man Memoization in JavaScript mit dem Map-Objekt implementiert.


Skills Graph

%%%%{init: {'theme':'neutral'}}%%%% flowchart RL javascript(("JavaScript")) -.-> javascript/BasicConceptsGroup(["Basic Concepts"]) javascript(("JavaScript")) -.-> javascript/AdvancedConceptsGroup(["Advanced Concepts"]) javascript(("JavaScript")) -.-> javascript/ToolsandEnvironmentGroup(["Tools and Environment"]) javascript/BasicConceptsGroup -.-> javascript/variables("Variables") javascript/BasicConceptsGroup -.-> javascript/data_types("Data Types") javascript/BasicConceptsGroup -.-> javascript/arith_ops("Arithmetic Operators") javascript/BasicConceptsGroup -.-> javascript/comp_ops("Comparison Operators") javascript/BasicConceptsGroup -.-> javascript/functions("Functions") javascript/BasicConceptsGroup -.-> javascript/obj_manip("Object Manipulation") javascript/AdvancedConceptsGroup -.-> javascript/closures("Closures") javascript/AdvancedConceptsGroup -.-> javascript/higher_funcs("Higher-Order Functions") javascript/ToolsandEnvironmentGroup -.-> javascript/debugging("Debugging") subgraph Lab Skills javascript/variables -.-> lab-28494{{"Funktionsoptimierung in JavaScript mit Memoization"}} javascript/data_types -.-> lab-28494{{"Funktionsoptimierung in JavaScript mit Memoization"}} javascript/arith_ops -.-> lab-28494{{"Funktionsoptimierung in JavaScript mit Memoization"}} javascript/comp_ops -.-> lab-28494{{"Funktionsoptimierung in JavaScript mit Memoization"}} javascript/functions -.-> lab-28494{{"Funktionsoptimierung in JavaScript mit Memoization"}} javascript/obj_manip -.-> lab-28494{{"Funktionsoptimierung in JavaScript mit Memoization"}} javascript/closures -.-> lab-28494{{"Funktionsoptimierung in JavaScript mit Memoization"}} javascript/higher_funcs -.-> lab-28494{{"Funktionsoptimierung in JavaScript mit Memoization"}} javascript/debugging -.-> lab-28494{{"Funktionsoptimierung in JavaScript mit Memoization"}} end

Memoize-Funktion

Um zu beginnen, öffnen Sie das Terminal/SSH und geben Sie node ein. Diese Funktion gibt die memoisierte (zwischengespeicherte) Funktion zurück. Hier sind die Schritte, um diese Funktion zu verwenden:

  1. Instanziieren Sie ein neues Map-Objekt, um einen leeren Cache zu erstellen.
  2. Geben Sie eine Funktion zurück, die ein einzelnes Argument annimmt, das an die memoisierte Funktion übergeben wird. Bevor die Funktion ausgeführt wird, überprüfen Sie, ob das Ergebnis für diesen spezifischen Eingabewert bereits zwischengespeichert ist. Wenn ja, geben Sie das zwischengespeicherte Ergebnis zurück; andernfalls speichern Sie es und geben Sie es zurück.
  3. Verwenden Sie das function-Schlüsselwort, um es der memoisierten Funktion zu ermöglichen, ihren this-Kontext gegebenenfalls zu ändern.
  4. Legen Sie den Cache als Eigenschaft auf der zurückgegebenen Funktion fest, um auf ihn zugreifen zu können.

Hier ist der Code, der die Memoize-Funktion implementiert:

const memoize = (fn) => {
  const cache = new Map();
  const cached = function (val) {
    return cache.has(val)
      ? cache.get(val)
      : cache.set(val, fn.call(this, val)) && cache.get(val);
  };
  cached.cache = cache;
  return cached;
};

Um zu sehen, wie diese Funktion funktioniert, können Sie sie mit der anagrams-Funktion verwenden. Hier ist ein Beispiel:

const anagramsCached = memoize(anagrams);
anagramsCached("javascript"); // dauert lange
anagramsCached("javascript"); // liefert fast sofort zurück, da es zwischengespeichert ist
console.log(anagramsCached.cache); // Die zwischengespeicherte Anagramme-Karte

Zusammenfassung

Herzlichen Glückwunsch! Sie haben das Memoize-Funktion-Lab abgeschlossen. Sie können in LabEx weitere Labs ausprobieren, um Ihre Fähigkeiten zu verbessern.