Šiame pavyzdyje išmoksite rašyti programą, kuri klonuoja objektą.
Norėdami suprasti šį pavyzdį, turite žinoti šias „JavaScript“ programavimo temas:
- „JavaScript“ objektai
- „JavaScripti Object.assign ()
„JavaScript“ objektas yra sudėtingas duomenų tipas, kuriame gali būti įvairių tipų duomenų. Pavyzdžiui,
const person = ( name: 'John', age: 21, )
Čia person
yra objektas. Dabar negalima klonuoti objekto, darant kažką panašaus.
const copy = person; console.log(copy); // (name: "John", age: 21)
Pirmiau pateiktoje programoje copy
kintamasis turi tą pačią reikšmę kaip ir person
objektas. Tačiau jei pakeisite objekto vertę, pasikeis ir copy
objekto vertė person
. Pavyzdžiui,
copy.name = 'Peter'; console.log(copy.name); // Peter console.log(person.name); // Peter
Pokyčiai pastebimi abiejuose objektuose, nes objektai yra nuorodų tipai . Ir abu, copy
ir person
rodo į tą patį objektą.
1 pavyzdys. Klonuokite objektą naudodami „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);
Rezultatas
(vardas: „Jonas“, amžius: 21) Petras Jonas
Object.assign()
Metodas yra dalis ES6 standartą. Šis Object.assign()
metodas atlieka gilią kopiją ir nukopijuoja visas ypatybes iš vieno ar daugiau objektų.
Pastaba : tuščias ()
kaip pirmasis argumentas užtikrina, kad nepakeisite pradinio objekto.
2 pavyzdys: Klonuokite objektą naudodami „Spread Syntax“
// 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);
Rezultatas
(vardas: „Jonas“, amžius: 21) Petras Jonas
Paskleidimo sintaksė …
buvo įvesta vėlesnėje versijoje (ES6).
Skleistą sintaksę galima naudoti negiliai kopijuojant objektą. Tai reiškia, kad jis nukopijuos objektą. Tačiau nurodomi gilesni objektai. Pavyzdžiui,
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
Čia, kai vidinė objekto vertė math
pakeičiama į 100clonePerson
objekto, keičiasi ir objekto math
rakto vertė person
.
3 pavyzdys: Objekto klonavimas naudojant 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);
Rezultatas
(vardas: „Jonas“, amžius: 21) Petras Jonas
Minėtoje programoje JSON.parse()
metodas naudojamas objekto klonavimui.
Pastaba : JSON.parse()
veikia tik su Number
ir String
objekto pažodinis. Jis neveikia su objektu pažodinis su function
arba symbol
savybių.