JavaScript 配列と非配列オブジェクトのディープクローンとシャロークローンの原則の詳細な説明

シャロークローニングとディープクローニングとは何ですか?

浅いクローン: スタックに格納されている値を対応する変数に直接割り当てます。基本データ型の場合は、対応する値が直接割り当てられます。参照型の場合は、アドレスが割り当てられます。
ディープクローニング: 対応する変数にデータを割り当てて、ソースデータとは無関係な新しいデータを生成します (データアドレスが変更されています)。つまり、オブジェクトの各レベルのプロパティです。
JavaScript では、基本データ型は記号「=」を使用して複製できますが、参照データ型では、実際の複製操作を実行せずに、変数のポインターを変更するためにのみ記号「=」を使用します。

1. アレイのクローンを作成する

1.1 浅いクローニング

for ループを使用して浅いクローンを作成します。

var arr1 = ['デモ', 1, 2];
var arr2 = [];
// 配列の浅いクローン for (var i = 0; i < arr1.length; i++) {
    arr2[i] = arr1[i];
}
コンソールログ(arr2);
コンソールにログ出力します。

出力：

配列(3)0: "デモ"1: 12: 2長さ: 3[[プロトタイプ]]: 配列(0)
間違い

1.2 ディープクローニング

ディープクローニングには再帰を使用します。

関数 deepClone(o) {
	var 結果 = [];
	(var i = 0; i < o.length; i++) の場合 {
		結果.push(deepClone(o[i]));
	}
	結果を返します。
}

2. 配列以外のオブジェクトの複製

2.1 浅いクローニング

for ループを使用して浅いクローンを作成します。

var obj1 = { a: 1, b: 2, c: 3, d: [4, 5, { e: 'デモ' }] };
var obj2 = {};
// オブジェクトの浅いクローン for (var i in obj1) {
    obj2[i] = obj1[i];
}
コンソールログ(obj2);
コンソールにログ出力します。(obj1 == obj2);

出力：

{a: 1、b: 2、c: 3、d: 配列(3)}
間違い

2.2 ディープクローニング

ディープクローニングには再帰を使用します。

関数 deepClone(o) {
	var 結果 = {};
	(変数 i が o の場合) {
		結果[i] = deepClone(o[i]);
	}
	結果を返します。
}

3. ディープクローン機能を統合

var obj1 = { a: 1, b: 2, c: 3, d: [4, 5, { e: 'デモ' }] };
var arr1 = ['デモ', 1, 2];
// ディープクローン関数 deepClone(o) {
    Array.isArray(o) の場合 {
        // は配列です var result = [];
        (var i = 0; i < o.length; i++) の場合 {
            結果.push(deepClone(o[i]));
        }
    } そうでない場合 (typeof o == 'object') {
        // 配列ではなくオブジェクトです var result = {};
        (変数 i が o の場合) {
            結果[i] = deepClone(o[i]);
        }
    } それ以外 {
        // 基本型の値 var result = o;
    }
    結果を返します。
}
コンソールにログ出力します。
コンソールにログ出力します。

これで、JavaScript 配列と非配列オブジェクトのディープクローンとシャロークローンの詳細な原則に関するこの記事は終了です。JavaScript 配列に関するより関連性の高いコンテンツについては、123WORDPRESS.COM で以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません: