この記事では、主にJavaScriptの配列とオブジェクトのコピーに関する関連知識を紹介します。非常に良い基準値を持っています。エディタで見てみましょう
1. データ型
JSは、狭義にはすべてのデータを基本型と参照型の2つの型に分けます。 基本型には未定義型、型があります。 Null、Boolean、Number、String、参照型は Object、一般的に使用される Array、Date、RegExp、Function などはすべて Object クラス 型に属します。
基本データと参照データの違いの 1 つは、変数をコピーするときに、基本データは独立した新しいコピーをコピーするのに対し、参照データは元の変数への参照をコピーすることです。以下に例を示します。
// 基本类型数据的复制 var a = 10; var b = a; // b = 10 a = 20; // a = 20, b = 10 // 引用类型数据的复制 var m = [1, 2]; var n = m; m[0] = 10; console.log(n[0]); // 10
参照ではなく参照型そのものの値をコピーしたい場合、明らかに上記の方法は使用できません。
2. 配列の浅いコピー
浅いコピーとは、オブジェクト (配列) がコピーされるときに、その参照フィールドの値はコピーされませんが、対応するフィールドの参照はコピーされることを意味します。例:
var src = [ 'alpha', ['bravo', 'chalie'] ]; var dest = []; for (var i = 0; i < src.length; i++) { dest[i] = src[i]; } //此时,如果改变src中的引用字段,dest中相应的字段也会被改变 src[1].push('delta'); console.log(dest[1]); // ['bravo', 'chalie', 'delta']
浅いコピーは通常、一次元配列、つまり配列に参照型が存在しない場合に使用されます。一般的に使用されるシャロー コピー メソッドは次のとおりです。
concat メソッド
var src = ['alpha', 'bravo'], dest = []; dest = dest.concat(src);
concat メソッドは、次のような配列のマージでより一般的に使用されます。
var a = ['alpha', 'bravo'], b = ['chalie', 'delta'], combine; combine = a.concat(b);
concat が配列のマージに使用される場合は、 2 つを組み合わせる 配列内のすべての要素を新しいオブジェクトにコピーしますが、大規模な配列ではコストがかかります。より良い方法は、後の配列の要素を前の配列にコピーすることです。
var src = ['alpha', 'bravo'], dest = ['chalie', 'delta']; Array.prototype.push.apply(src, dest);
slice メソッド
slice メソッドは、既存の配列から選択された要素を返し、新しい配列を返すことができます。
var src = ['alpha', 'bravo'], var dest = src.slice(0);
3. オブジェクトの浅いコピー
オブジェクトの浅いコピーは for-in トラバーサルを使用して実現でき、より便利な Object.assign() メソッドが es6 で提供されています。
var src = {name: 'fox', age: 20}, dest = null; dest = Object.assign({}, src);
jQueryの$.extend、アンダースコアの_.extendなどを使用してオブジェクトをコピーすることもできます。
4. 深いコピー
浅いコピーの適用シナリオは限られており、多くの場合、オブジェクトを完全なコピーにコピーできることが期待されており、各フィールドを比較するために typeof または instanof 演算子を使用する必要があります。タイプが判断されます。フィールドが基本タイプの場合は、直接コピーできます。フィールドが参照型の場合、フィールドのすべてのフィールドに対して上記の判断を行う必要があるため、再帰を使用してこの関数を実装することを検討しやすくなります。
function deep_copy(src, dest) { for (var p in src) { if (Array.isArray(src[p]) || src[p] instanceof Object) { dest[p] = Array.isArray(src[p]) ? [] : {}; arguments.callee(dest[p], src[p]); }else { dest[p] = src[p]; } } }
上記のコードでは、配列は特別なオブジェクトであるため、for-in を使用して走査できます。
さらに、jsonメソッドも使用できます:
function deep_copy_in_json(src) { return JSON.parse(JSON.stringify(src)); }
これは比較的単純ですが、コンストラクター属性やオブジェクト内の一部のメソッドなど、元のオブジェクトの多くのプロパティが操作後に失われます。プロトタイプ。
以上がJavaScript の配列とオブジェクトをコピーするコード例の分析の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。