JavaScript オブジェクトを完全に複製するにはどうすればよいですか?

JavaScript オブジェクトを正確に複製する方法

JavaScript の組み込みメソッドは、オブジェクトの正確な複製を保証できません。これは、プロトタイプ派生プロパティと非表示属性が存在するためで、クローン作成時に予期しない結果が生じる可能性があります。この問題に対処するために、さまざまなアプローチが開発されています。

2022 年更新: 構造化クローニング

構造化クローニングと呼ばれる新しい JS 標準は、簡単な解決策を提供します。これは多くの最新ブラウザでサポートされており、次の構文で正確な複製が可能です:

const clone = structuredClone(object);

従来のアプローチ

以前のバージョンの JavaScript では、カスタム クローン作成関数次の手順を使用して実装できます:

1. 列挙不可能なプロパティの処理: hasOwnProperty メソッドを使用して、プロトタイプ プロパティをスキップし、オブジェクトに直接定義されているプロパティに焦点を当てます。
2. 列挙不可能な属性の複製: プロトタイプや __proto__ など、名前がわかっている場合は、非表示のプロパティを明示的にコピーします。
3. プロトタイプ継承の構成: コピーされたオブジェクトのプロトタイプが元のプロトタイプと一致することを確認します。これには、手動で設定するか、ソース オブジェクトのコンストラクターを呼び出す必要がある場合があります。
4. 列挙不可能なデータ構造の処理: Date オブジェクトなど、列挙不可能なメンバーを含むデータ構造には、特定の処理が必要です。
5. 循環構造の処理: 訪問したオブジェクトを追跡し、ディープ クローン作成の代わりに参照を共有することで、無限再帰を回避します。

例これらの課題に対処するクローン作成関数を以下に示します。

function clone(obj) {
    if (null == obj || "object" != typeof obj) return obj;

    // Handing different object types
    // ... implementation for Date, Array, and Object

    // Generic fallback: deep copy properties
    var copy = {};
    for (var attr in obj) {
        if (obj.hasOwnProperty(attr)) copy[attr] = clone(obj[attr]);
    }
    return copy;
}

この関数は、オブジェクトがツリー構造を形成し、循環参照が含まれていないことを前提としています。循環構造を処理するには、より複雑なアプローチが必要です。

以上がJavaScript オブジェクトを完全に複製するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。