はじめに
この実験では、JavaScript でオブジェクトのディープクローンを作成する方法を学びます。クラス インスタンスを除外しながら、再帰を使ってプリミティブ型、配列、およびオブジェクトをクローンします。この実験が終了すると、元のオブジェクトを変更することなく、オブジェクトの完全なコピーを作成できるようになります。
This tutorial is from open-source community. Access the source code
💡 このチュートリアルは英語版からAIによって翻訳されています。原文を確認するには、 ここをクリックしてください
この実験では、JavaScript でオブジェクトのディープクローンを作成する方法を学びます。クラス インスタンスを除外しながら、再帰を使ってプリミティブ型、配列、およびオブジェクトをクローンします。この実験が終了すると、元のオブジェクトを変更することなく、オブジェクトの完全なコピーを作成できるようになります。
オブジェクトをディープクローンするには、次の手順に従います。
node
と入力します。null
であるかどうかを確認し、その場合は null
を返します。Object.assign()
と空のオブジェクト ({}
) を使って、元のオブジェクトのシャロークローンを作成します。Object.keys()
と Array.prototype.forEach()
を使って、どのキーと値のペアがディープクローンする必要があるかを判断します。Array
の場合、clone
の length
を元のものに設定し、Array.from()
を使ってクローンを作成します。const deepClone = (obj) => {
if (obj === null) return null;
let clone = Object.assign({}, obj);
Object.keys(clone).forEach(
(key) =>
(clone[key] =
typeof obj[key] === "object" ? deepClone(obj[key]) : obj[key])
);
if (Array.isArray(obj)) {
clone.length = obj.length;
return Array.from(clone);
}
return clone;
};
次のコードを使って、ディープクローニング関数をテストします。
const a = { foo: "bar", obj: { a: 1, b: 2 } };
const b = deepClone(a); // a!== b, a.obj!== b.obj
おめでとうございます!あなたはディープクローンオブジェクトの実験を完了しました。あなたのスキルを向上させるために、LabExでさらに多くの実験を行って練習することができます。