js における浅いコピーと深いコピーの詳細な説明

1. jsメモリ

js のメモリ、またはほとんどの言語のメモリはスタックとヒープに分かれています。基本データ型の変数値はスタック上に割り当てられ、参照データ型の変数値はヒープ上に割り当てられます。スタックはヒープ内の特定のオブジェクトのアドレスのみを格納します。

2. 譲渡

基本データ型の場合、代入操作はコピーです。つまり、新しい変数と古い変数は互いに影響しません。

var a = 1;
var b = a;
2 = 2;
コンソールログ(b); // 2

参照データ型の場合、代入操作は、ヒープ内のオブジェクトを指す変数をスタックに追加するだけです。つまり、参照アドレスをコピーします。新しい変数と古い変数は相互に影響を及ぼします。つまり、新しい変数のオブジェクト値が変更されると、古い変数の対応する値も変更されます。

var a = {
    名前: 「マイク」
};
var b = a;
b.name = "ジャック";
console.log(a); // {名前: "jack"}

3. 浅いコピー

基本データ型とネストされたオブジェクトのないデータの場合、すべての操作はコピー操作であり、新しい変数と古い変数は相互に影響を与えません。

var a = {
    名前: 「マイク」
};
var b = {};
b.名前 = a.名前;
b.name = "ジャック";
console.log(a) // {名前: "mike"}

ただし、ネストされたオブジェクトを持つデータの場合、浅いコピーでは第 1 レベルのオブジェクトのみがコピーされ、より深いレベルの値は参照アドレスとしてコピーされたままになります。

var a = {
    名前: 「マイク」、
    言語：
        最初：「英語」、
        2番目：「中国語」
    }
};
var b = {};
b.名前 = a.名前;
b.name = "ジャック";
b.言語 = a.言語;
b.language.first = "日本語"
console.log(a) // { 言語 : {最初: "日本語"、2番目: "中国語"}}

js は浅いコピーを実装します。その考え方は、 targetの各属性を走査し、属性名と値を新しい変数に割り当てるというものです。
代入の意味を理解していれば、コードの 4 行目では、 target[key]の値がオブジェクトの場合に、代入によって新しい変数が割り当てられ、基本的にはヒープ内の参照データ型のアドレスがコピーされます。浅いコピーでは、ネストされたオブジェクトであるかどうかによって結果が異なる理由を理解するのは難しくありません。

関数 shallowCopy(ターゲット) {
    結果を {} とします。
    for (const キー in ターゲット) {
        結果[キー] = ターゲット[キー];
    }
    結果を返します。
}

4. ディープコピー

ディープコピーは完全なコピーであり、新しい変数と古い変数は互いに影響を及ぼしません。
パラメータがオブジェクトかどうかによって処理方法が異なります。オブジェクトの場合は、オブジェクトの各属性と値が割り当てられ、再帰的に処理されます。それ以外の場合は、直接返されます。

関数クローン(ターゲット) {
    if (typeof ターゲット === "オブジェクト") {
        //配列かどうかを判断します let result = Array.isArray(target)? [] : {};
        for (const キー in ターゲット) {
            結果[キー] = clone(ターゲット[キー]);
        }
        結果を返します。
    } それ以外 {
        ターゲットを返します。
    }
}

これで、js の代入の浅いコピーと深いコピーに関する詳細な記事は終わりです。js の代入の浅いコピーと深いコピーに関するより関連性の高いコンテンツについては、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後も 123WORDPRESS.COM を応援していただければ幸いです。

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