Ebben a példában megtanul írni egy programot, amely klónoz egy objektumot.
A példa megértéséhez ismernie kell a következő JavaScript programozási témákat:
- JavaScript objektumok
- JavaScript Object.assign ()
A JavaScript objektum egy összetett adattípus, amely különféle adattípusokat tartalmazhat. Például,
const person = ( name: 'John', age: 21, )
Itt personvan egy tárgy. Most nem klónozhat objektumot ilyesmivel.
const copy = person; console.log(copy); // (name: "John", age: 21)
A fenti programban a copyváltozó értéke megegyezik az personobjektum értékével . Ha azonban megváltoztatja az copyobjektum értékét, akkor az personobjektum értéke is megváltozik. Például,
copy.name = 'Peter'; console.log(copy.name); // Peter console.log(person.name); // Peter
A változás mindkét objektumban látható, mert az objektumok referencia típusok . És mindkettő, copyés personugyanarra a tárgyra mutat.
1. példa: Az objektum klónozása az Object.assign () használatával
// 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);
Kimenet
(név: "János", életkor: 21) Péter János
A Object.assign()módszer az ES6 szabvány része . A Object.assign()módszer mély másolatot végez, és az összes tulajdonságot egy vagy több objektumból másolja.
Megjegyzés : Az üres, ()mint első argumentum biztosítja, hogy ne változtassa meg az eredeti objektumot.
2. példa: Az objektum klónozása a Spread Syntax segítségével
// 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);
Kimenet
(név: "János", életkor: 21) Péter János
A terjedési szintaxist … a későbbi verzióban (ES6) vezették be.
A terjedési szintaxissal lehet sekély másolatot készíteni az objektumból. Ez azt jelenti, hogy lemásolja az objektumot. A mélyebb objektumokra azonban hivatkozunk. Például,
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
Itt, amikor a belső objektum értéke 100 objektumra mathváltozik, az objektum kulcsának értéke is megváltozik.clonePersonmathperson
3. példa: Az objektum klónozása a JSON.parse () használatával
// 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);
Kimenet
(név: "János", életkor: 21) Péter János
A fenti programban a JSON.parse()módszert egy objektum klónozására használják.
Megjegyzés : JSON.parse()csak az objektum Numberés az Stringobjektum szó szerint működik . Nem működik egy objektummal functionvagy symboltulajdonságokkal rendelkező objektummal .
