Heim >Web-Frontend >js-Tutorial >Unveränderlichkeit in JavaScript
Unveränderlichkeit: Ein Eckpfeiler der funktionellen Programmierung, das auch den objektorientierten Programmierungen erhebliche Vorteile bietet. In diesem Artikel wird die Unveränderlichkeit in JavaScript untersucht und seine Implementierung und Vorteile beschrieben.
Schlüsselkonzepte:
Unveränderlichkeit verstehen:
, die einfach ausgedrückt, bedeutet, dass sich etwas ändern kann. Bei der Programmierung ermöglichen veränderliche Objekte Änderungen in ihrem Zustand. Die Unmutabilität ist das Gegenteil: Ein unveränderlicher Wert bleibt nach der Erstellung konstant. Viele gemeinsame Werte sind unveränderlich. Zum Beispiel:
<code class="language-javascript">const statement = "I am an immutable value"; const otherStr = statement.slice(8, 17); </code>
otherStr
ist eine neue Zeichenfolge; statement
bleibt unverändert. String -Methoden erstellen neue Zeichenfolgen; Sie ändern das Original nicht. Dies liegt daran, dass Saiten unveränderlich sind. Zahlen teilen dieses Merkmal.
Mutability in JavaScript:
Die integrierten Saiten und Zahlen von JavaScript sind unveränderlich. Arrays sind jedoch veränderlich:
<code class="language-javascript">let arr = []; let v2 = arr.push(2); // arr is modified; v2 holds the new length</code>an
würde sich anders verhalten: ImmutableArray
<code class="language-javascript">const arr = new ImmutableArray([1, 2, 3, 4]); const v2 = arr.push(5); arr.toArray(); // [1, 2, 3, 4] v2.toArray(); // [1, 2, 3, 4, 5]</code>In ähnlicher Weise würde ein
(Ersetzen von Objekten) ein neues Objekt zurückgeben, wenn die Eigenschaften "festgelegt" sind: ImmutableMap
<code class="language-javascript">const person = new ImmutableMap({name: "Chris", age: 32}); const olderPerson = person.set("age", 33); person.toObject(); // {name: "Chris", age: 32} olderPerson.toObject(); // {name: "Chris", age: 33}</code>
Unveränderlichkeit in der Praxis (unter Verwendung von unveränderlich.js):
Da JavaScript keine nativen, unveränderlichen Strukturen gibt, verwenden wir eine Bibliothek wie Unerable.js. Betrachten wir ein Beispiel für ein Minensuchspiel. Das Board ist eine unveränderliche Karte mit als unveränderliche Liste unveränderlicher Karten (jede Kachel). Initialisierung verwendet tiles
's immutable.js
Funktion: fromJS
<code class="language-javascript">function createGame(options) { return Immutable.fromJS({ cols: options.cols, rows: options.rows, tiles: initTiles(options.rows, options.cols, options.mines) }); }</code>Spiellogikfunktionen nehmen die unveränderliche Struktur und geben neue Instanzen zurück.
kennzeichnet eine Fliese, wie enthüllt. Mit veränderlichen Daten: revealTile
<code class="language-javascript">function revealTile(game, tile) { game.tiles[tile].isRevealed = true; //Direct mutation }</code>Mit unveränderlichen Daten verwenden wir
: setIn
<code class="language-javascript">function revealTile(game, tile) { return game.setIn(['tiles', tile, 'isRevealed'], true); }</code>
Gibt eine neue unveränderliche Instanz zurück. Zur Robustheit können wir nach setIn
: getIn
nach Fliesen existieren.
<code class="language-javascript">function revealTile(game, tile) { return game.getIn(['tiles', tile]) ? game.setIn(['tiles', tile, 'isRevealed'], true) : game; }</code>
Leistungsüberlegungen:
Während das Erstellen neuer Objekte ineffizient erscheint, minimiert "Structural Sharing" den Speicheraufwand. Die Leistungsauswirkungen werden häufig durch die Vorteile der Unveränderlichkeit überwogen.
Verbesserte Änderungsverfolgung:
Unveränderlichkeit vereinfacht die Veränderung der Verfolgung in UI -Frameworks. Vergleich der Referenzen (a === b
) effizient bestimmt, ob sich der Zustand geändert hat.
Schlussfolgerung:
Unveränderlichkeit verbessert die Codequalität und -wartbarkeit. Während die Lernkurve erforderlich ist, überwiegen ihre Vorteile häufig die anfänglichen Herausforderungen. Entdecken Sie den bereitgestellten CodePen (Link, der in Originaltext nicht bereitgestellt wird) für ein vollständiges Beispiel für Minenweiter.
(FAQS -Abschnitt für die Kürze entfernt, da es sich um eine Wiederholung von Informationen handelt, die bereits im Haupttext enthalten sind. Wenn Sie es möchten, lassen Sie es mich bitte wissen.)
Das obige ist der detaillierte Inhalt vonUnveränderlichkeit in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!