V tomto príklade sa naučíte písať program, ktorý klonuje objekt.
Aby ste pochopili tento príklad, mali by ste mať znalosti nasledujúcich tém programovania v jazyku JavaScript:
- Objekty JavaScript
- Objekt JavaScript. ()
Objekt JavaScript je komplexný dátový typ, ktorý môže obsahovať rôzne dátové typy. Napríklad,
const person = ( name: 'John', age: 21, )
Tu person
je objekt. Teraz nemôžete klonovať objekt tak, že urobíte niečo také.
const copy = person; console.log(copy); // (name: "John", age: 21)
Vo vyššie uvedenom programe má copy
premenná rovnakú hodnotu ako person
objekt. Ak však zmeníte hodnotu copy
objektu, person
zmení sa aj hodnota v objekte. Napríklad,
copy.name = 'Peter'; console.log(copy.name); // Peter console.log(person.name); // Peter
Zmena je viditeľná na oboch objektoch, pretože objekty sú referenčnými typmi . A obaja copy
a person
smerujú k rovnakému objektu.
Príklad 1. Klonovanie objektu pomocou 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ýkon
(meno: „John“, vek: 21 rokov) Peter John
Object.assign()
Metóda je súčasťou ES6 štandardu. Tieto Object.assign()
metóda vykonáva hlboké kopírovanie a skopíruje všetky vlastnosti z jedného alebo viacerých objektov.
Poznámka : Prázdny ()
argument ako prvý zaručuje, že pôvodný objekt nezmeníte.
Príklad 2: Klonovanie objektu pomocou syntaxe rozšírenia
// 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ýkon
(meno: „John“, vek: 21 rokov) Peter John
Syntax šírenia …
bola zavedená v novšej verzii (ES6).
Syntax šírenia sa dá použiť na vytvorenie plytkej kópie objektu. To znamená, že skopíruje objekt. Na hlbšie objekty sa však odkazuje. Naprí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
Tu, keď sa hodnota vnútornej objekt math
sa zmení na 100 z clonePerson
objektu, hodnota math
kľúča person
objektu sa tiež mení.
Príklad 3: Klonovanie objektu pomocou 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ýkon
(meno: „John“, vek: 21 rokov) Peter John
Vo vyššie uvedenom programe sa JSON.parse()
metóda používa na klonovanie objektu.
Poznámka : JSON.parse()
iba pracuje s Number
a String
doslovný objektu. Nepracuje s objektom doslovným function
ani s symbol
vlastnosťami.