シャローコピーとディープコピー

CoddyのJavaScriptジャーニー「論理とフロー」セクションの一部。レッスン 25/65。

object を copy するとき、copy には2種類あります：

浅い Copy - 第1階層のみを copy
深い Copy - すべての nested 階層を copy

浅いコピーの方法：

スプレッド演算子を使用する：

const original = { a: 1, b: { x: 2 } };
const spreadCopy = { ...original };

ソースからターゲットの object へプロパティをコピーして新しい object を作成する Object.assign() の使用：

const assignCopy = Object.assign({}, original);

浅いコピーの問題：

original.b.x = 3;
console.log(spreadCopy.b.x); // 3
// （ネストされたオブジェクトは参照を共有する）

console.log(assignCopy.b.x); // 3

JSONメソッドとディープコピーを理解する

JSON.stringify()は、JavaScriptオブジェクトをJSON文字列に変換します。

const obj = { name: "John", age: 30 };
const jsonString = JSON.stringify(obj);
console.log(jsonString); // "{"name":"John","age":30}"

JSON.parse() は JSON 文字列を JavaScript オブジェクトに戻します。

const backToObject = JSON.parse(jsonString);
console.log(backToObject); // { name: "John", age: 30 }

JSONを使用したディープコピー：

const original = { a: 1, b: { x: 2 } };
const deepCopy = JSON.parse(JSON.stringify(original));

original.b.x = 3;
console.log(deepCopy.b.x); // 2（完全に独立）

チャレンジ

簡単

processCartという名前の関数を作成してください。この関数は、ショッピングカートを表すJSON stringを受け取ります。カートには、名前と価格を持つ商品の配列が含まれています。あなたの課題は次のとおりです。

JSON stringをJavaScriptのobjectにParseする
そこから別々の2つのカートをCreateする
2つ目のカートで、
1. 各アイテムにdiscountedプロパティを追加し、falseに設定する
2. priceが50より大きいすべてのアイテムに10%の割引を適用する
3. 割引を受けたアイテムの'discounted'をtrueに設定する
両方のカートを含む配列をreturnする

REQUIRED OUTPUT FORMAT: [Your translated content here]

自分で試してみよう

function processCart(jsonString) {
    // ここにコードを書いてください
}
// 関数の外には何も書かないでください

腕試し

このレッスンには短いクイズがあります。レッスンを始めて解答し、進捗を記録しましょう。

論理とフローのすべてのレッスン

1文字列の詳細

文字列の基本文字列の反復処理テンプレートリテラル文字列メソッド復習 - String Weaver

4JSON パート2

JSONの反復処理ネストされたJSON JSONの Optional Chainingシャローコピーとディープコピー復習 - 自転車店復習 - 太陽系

7図書館管理システム

10フェスティバルシステムの管理

自分で練習してみよう: JavaScriptオンラインコンパイラ