JavaScriptの不変性

不変性：機能的なプログラミングの基礎は、オブジェクト指向プログラミングにも大きな利点を提供します。この記事では、JavaScriptの不変性を調査し、その実装と利点を詳述しています。

重要な概念：

• 不変性：作成されたら、不変のオブジェクトの状態は変更されません。これは、状態を変更できる可変オブジェクトとは対照的です。 JavaScriptでは、文字列や数字のようなプリミティブは不変であり、アレイとオブジェクトは可変です。
不変のデータ構造：アレイとオブジェクトで不変性を達成するには、オリジナルを変更する代わりに、変更時に新しいインスタンスを作成する必要があります。 JavaScriptには組み込みのサポートがありません。MoriやImmutable.jsのようなライブラリを必要とします。
• パフォーマンス：最初にメモリを集中しているように見えますが、不変性は「構造共有」を通じてパフォーマンスを向上させることがよくあります。 また、UIフレームワークで重要な変更追跡を簡素化します
• 不変性の理解：

簡単に言えば、何かが変化する可能性があることを意味します。 プログラミングでは、可変オブジェクトが状態の変更を可能にします。 不変性は逆です。未だに不変の価値は、作成後も一定のままです。 多くの一般的な値は不変です。たとえば、

は新しい文字列です。

は変更されていません。 文字列メソッドは新しい文字列を作成します。オリジナルを変更しません。これは、弦が不変だからです。数字はこの特性を共有しています。

JavaScriptの可変性：

<code class="language-javascript">const statement = "I am an immutable value";
const otherStr = statement.slice(8, 17); </code>

otherStr JavaScriptの組み込み文字列と数字は不可能です。ただし、配列は可変です：statement

an は異なる動作をします：

同様に、プロパティが「設定されている」ときに

（オブジェクトの交換）は新しいオブジェクトを返します。

<code class="language-javascript">let arr = [];
let v2 = arr.push(2); // arr is modified; v2 holds the new length</code>

実際の不変性（Immutable.jsを使用）：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>

JavaScriptにはネイティブの不変構造がないため、Immutable.jsのようなライブラリを使用します。 Minesweeperゲームの例を考えてみましょう。ボードは不変のマップであり、

は不変のマップのリスト（各タイル）です。 初期化にはImmutableMap 's

関数：

<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>

が使用されます

ゲームロジック関数新しいインスタンスを返す不変の構造を取ります。 明らかにされたようにタイルにフラグがあります。 可変データを使用してください：

不変のデータを使用すると、tiles：immutable.jsを使用します 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>

新しい不変のインスタンスを返します。 堅牢性のために、

：revealTileを使用してタイルの存在を確認できます。

<code class="language-javascript">function revealTile(game, tile) {
  game.tiles[tile].isRevealed = true; //Direct mutation
}</code>

パフォーマンスに関する考慮事項：setIn

新しいオブジェクトを作成することは非効率的に見えるかもしれませんが、「構造共有」はメモリのオーバーヘッドを最小化します。 パフォーマンスへの影響は、不変性の利点によってしばしば上回ることがよくあります。

改善された変更追跡：

不変性は、UIフレームワークの変更追跡を簡素化します。 参考文献（

）を比較すると、状態が変更されたかどうかを効率的に決定します。 a === b

結論：

不変性により、コードの品質と保守性が向上します。 学習曲線が必要ですが、その利点はしばしば最初の課題を上回ります。 完全なMinesweeperの例については、提供されたCodepen（元のテキストで提供されていないリンク）を探索してください。

（FAQSセクションは簡潔にするために削除されました。これは、メインテキストに既に存在する情報の繰り返しであるためです。あなたがそれを含めたい場合は、私に知らせてください。

以上がJavaScriptの不変性の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。