Płytka i głęboka kopia
Część sekcji Logika i przepływ programu ścieżki JavaScript w Coddy. Lekcja 25 z 65.
Podczas kopiowania obiektów mamy dwa rodzaje kopii:
- Kopia płytka — kopiuje tylko pierwszy poziom
- Kopia głęboka — kopiuje wszystkie zagnieżdżone poziomy
Metody płytkiego kopiowania:
Używając operatora roz spread:
const original = { a: 1, b: { x: 2 } };
const spreadCopy = { ...original };Używanie Object.assign(), które tworzy nowy obiekt przez kopiowanie właściwości z obiektu źródłowego do docelowego:
const assignCopy = Object.assign({}, original);Problem z płytką kopią:
original.b.x = 3;
console.log(spreadCopy.b.x); // 3
// (obiekty zagnieżdżone współdzielą referencję)
console.log(assignCopy.b.x); // 3Poznawanie metod JSON i głębokiego kopiowania
JSON.stringify() konwertuje obiekt JavaScript na ciąg JSON:
const obj = { name: "John", age: 30 };
const jsonString = JSON.stringify(obj);
console.log(jsonString); // "{"name":"John","age":30}"JSON.parse() konwertuje ciąg JSON z powrotem na obiekt JavaScript:
const backToObject = JSON.parse(jsonString);
console.log(backToObject); // { name: "John", age: 30 }Głęboka kopia przy użyciu 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 (całkowicie niezależna)
Wyzwanie
ŁatwyUtwórz funkcję o nazwie processCart, która przyjmuje łańcuch znaków JSON reprezentujący koszyk zakupowy. Koszyk zawiera tablicę produktów z nazwami i cenami. Twoje zadanie:
- Przekształć łańcuch znaków JSON w obiekt JavaScript
- Utwórz z niego DWA osobne koszyki
- W drugim koszyku:
- Dodaj do każdego elementu właściwość
discountedustawioną na false - Zastosuj 10% zniżki do wszystkich elementów, których
pricejest większe niż 50 - Ustaw 'discounted' na true dla elementów, które otrzymały zniżkę
- Dodaj do każdego elementu właściwość
- Zwróć tablicę zawierającą oba koszyki
Spróbuj swoich sił
function processCart(jsonString) {
// Napisz kod tutaj
}
// Nie pisz niczego poza funkcją
Sprawdź sięTa lekcja zawiera krótki quiz. Zacznij lekcję, żeby na niego odpowiedzieć i śledzić swoje postępy.
Wszystkie lekcje w sekcji Logika i przepływ programu
1Napisy w praktyce
Podstawy napisówIterowanie po napisachLiterały szablonoweMetody napisówPodsumowanie – mistrz napisów4JSON, część 2
Iterowanie po JSONZagnieżdżony JSONOpcjonalne łańcuchowanie w JSONPłytka i głęboka kopiaPowtórka — sklep rowerowyPowtórka — Układ Słoneczny7System zarządzania biblioteką
Omówienie projektuDodawanie książek
Wyszukiwanie według tytułuFiltrowanie według gatunkuOznaczanie jako przeczytane10Zarządzanie systemem festiwalowym
Przegląd projektuDodawanie filmów i miejscDodawanie seansuKupowanie biletówOcenianie filmówAnulowanie seansów2Tablice wielowymiarowe
Podstawy tablic 2DDostęp do elementów tablic 2DZagnieżdżone pętle z tablicami 2DPowtórka — tablice 2DDodawanie i odejmowanie macierzyTablice nieregularneTablice 3D i większeTypowe wzorce tablic 2DPowtórka — wszystko o tablicach5Zbiory — część 1
Czym jest zbiór?Iterowanie po zbiorachDodawanie elementuUsuwanie elementuSprawdzanie, czy element istniejeRozmiar i sprawdzanie, czy zbiór jest pustyKopiowanie i czyszczeniePodsumowanie — podstawy zbiorów8Ciekawe zagadnienia dotyczące tablic
Destrukturyzacja tablicSkładnia spread w tablicachRzadkie tablicePodsumowanie – warsztaty z tablic3JSON część 1
Czym jest JSON?Sprawdzanie, czy klucz istniejeMetody obiektówOperator spread — część 1Operator spread — część 2Usuwanie kluczyPodsumowanie — manipulowanie kluczami w JSONPoćwicz samodzielnie: Kompilator JavaScript online