V tomto příkladu se naučíte psát program, který klonuje objekt.
Abyste pochopili tento příklad, měli byste znát následující programovací témata JavaScriptu:
- Objekty JavaScript
- Objekt JavaScript. ()
Objekt JavaScript je komplexní datový typ, který může obsahovat různé datové typy. Například,
const person = ( name: 'John', age: 21, )
Tady personje objekt. Nyní nemůžete klonovat objekt takovýmto způsobem.
const copy = person; console.log(copy); // (name: "John", age: 21)
Ve výše uvedeném programu má copyproměnná stejnou hodnotu jako personobjekt. Pokud však změníte hodnotu copyobjektu, personzmění se také hodnota v objektu. Například,
copy.name = 'Peter'; console.log(copy.name); // Peter console.log(person.name); // Peter
Změna se projeví u obou objektů, protože objekty jsou referenční typy . A oba copya personukazují na stejný objekt.
Příklad 1. Klonujte objekt pomocí Object.assign ()
// program to clone the object // declaring object const person = ( name: 'John', age: 21, ) // cloning the object const clonePerson = Object.assign((), person); console.log(clonePerson); // changing the value of clonePerson clonePerson.name = 'Peter'; console.log(clonePerson.name); console.log(person.name);
Výstup
(jméno: „John“, věk: 21 let) Peter John
Object.assign()Metoda je součástí ES6 standardu. Tyto Object.assign()metoda provádí hluboké kopírování a zkopíruje všechny vlastnosti z jednoho nebo více objektů.
Poznámka : Prázdný ()jako první argument zajišťuje, že nezměníte původní objekt.
Příklad 2: Klonujte objekt pomocí Spread Syntaxe
// program to clone the object // declaring object const person = ( name: 'John', age: 21, ) // cloning the object const clonePerson = (… person) console.log(clonePerson); // changing the value of clonePerson clonePerson.name = 'Peter'; console.log(clonePerson.name); console.log(person.name);
Výstup
(jméno: „John“, věk: 21 let) Peter John
Syntaxe šíření … byla zavedena v novější verzi (ES6).
Syntaxi šíření lze použít k vytvoření mělké kopie objektu. To znamená, že zkopíruje objekt. Na hlubší objekty se však odkazuje. Například,
const person = ( name: 'John', age: 21, // the inner objects will change in the shallow copy marks: ( math: 66, english: 73) ) // cloning the object const clonePerson = (… person) console.log(clonePerson); // (name: "John", age: 21, marks: (… )) // changing the value of clonePerson clonePerson.marks.math = 100; console.log(clonePerson.marks.math); // 100 console.log(person.marks.math); // 100
Tady, když se hodnota vnitřní objekt mathse změní na 100 z clonePersonobjektu, hodnota mathklíče personobjektu se také mění.
Příklad 3: Klonování objektu pomocí JSON.parse ()
// program to clone the object // declaring object const person = ( name: 'John', age: 21, ) // cloning the object const clonePerson = JSON.parse(JSON.stringify(person)); console.log(clonePerson); // changing the value of clonePerson clonePerson.name = 'Peter'; console.log(clonePerson.name); console.log(person.name);
Výstup
(jméno: „John“, věk: 21 let) Peter John
Ve výše uvedeném programu se JSON.parse()metoda používá ke klonování objektu.
Poznámka : JSON.parse()pouze pracuje s Numbera Stringliterálu objektu. Nepracuje s literálem objektu functionnebo s symbolvlastnostmi.
