ES6 でアレイのクローンを作成するにはどうすればよいですか?

ES5 では、concat メソッドを使用して配列をコピーします。さらに、一部の開発者は、参照される配列のすべての要素をスライスし、引数として 0 を渡すことによって新しい配列を作成する、slice() メソッドを使用します。

ユーザーは、以下の例に従って、slice() メソッドを使用して配列のクローンを作成できます。さまざまなデータ型の値を含む array1 を作成しました。その後、slice()メソッドを使用してarray1をコピーし、「clone」変数に格納します。

ユーザーは、ES5 で配列のクローンを作成する方法をすでにご覧になっています。

さらに、ユーザーは、代入演算子を使用して、文字列、数値、ブール値などの通常の変数と同じように配列をコピーすることを検討できます。

代入演算子を使用して配列をコピーするときに問題が発生する可能性があります。次の例を通してそれを理解してみましょう。

代入演算子を使用して配列をコピーする

以下の例では、文字列配列にさまざまな文字列が含まれています。 strings 配列を strings2 配列に割り当てました。その後、新しい文字列値を strings2 配列にプッシュします。

上記の出力では、文字列値を strings2 配列にプッシュすると、strings 配列にもプッシュされることがわかります。なぜこのようなことが起こるのでしょうか?

ここで、可変オブジェクトと不変オブジェクトの概念が登場します。

可変オブジェクトと不変オブジェクト

JavaScript では、配列とオブジェクトは変更可能です。つまり、作成後に初期化した後で値を変更できます。したがって、上記の例では strings2 配列は存在しません。 strings 配列を strings2 配列に代入すると、strings 配列への参照が生成されます。したがって、strings2 配列を変更すると、string 配列も変更されます。

したがって、他の配列を参照せずに配列の実際のコピーを作成する必要があります

それでは、ES6 で配列のクローンを作成する方法を学びましょう。

ES6 でスプレッド演算子 (...) を使用して配列のクローンを作成する

展開演算子の構文は 3 つのドット (...) です。これを使用して、配列などの反復可能なオブジェクトを分散できます。スプレッド演算子は、配列またはオブジェクトの新しいコピーを作成します。

ユーザーは、次の構文に従ってスプレッド演算子を使用して配列をコピーできます。

以下の例では、さまざまなブール値を含むブール配列を作成しました。その後、スプレッド演算子を使用してブール配列のコピーを作成し、そのコピーを booleanCopy 変数に割り当てます。

出力では、booleanCopy 配列に boolean 配列に含まれる値と同じ値が含まれていることを確認できます。

以下の例では、次元配列にさまざまな数値が含まれています。スプレッド演算子を使用して size 配列のコピーを作成し、代入演算子を使用してその配列を sizeClone 変数に保存しました。

その後、60 を sizeClone 配列にプッシュします。

上記の出力では、例 2 の参照配列のように、代わりに配列の実際のコピーを作成しているため、60 が

に反映されていますが、Sizes 配列には反映されていないことがわかります。

スプレッド演算子が使用される理由を明確に理解できるようになりました。

以上がES6 でアレイのクローンを作成するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。