Dalam contoh ini, anda akan belajar menulis program yang mengklon objek.
Untuk memahami contoh ini, anda harus mempunyai pengetahuan mengenai topik pengaturcaraan JavaScript berikut:
- Objek JavaScript
- Objek JavaScript.assign ()
Objek JavaScript adalah jenis data kompleks yang boleh mengandungi pelbagai jenis data. Sebagai contoh,
const person = ( name: 'John', age: 21, )
Di sini, personadalah objek. Sekarang, anda tidak dapat mengklon objek dengan melakukan perkara seperti ini.
const copy = person; console.log(copy); // (name: "John", age: 21)
Dalam program di atas, copypemboleh ubah mempunyai nilai yang sama dengan personobjek. Namun, jika anda mengubah nilai copyobjek, nilai dalam personobjek juga akan berubah. Sebagai contoh,
copy.name = 'Peter'; console.log(copy.name); // Peter console.log(person.name); // Peter
Perubahan dilihat pada kedua objek kerana objek adalah jenis rujukan . Dan kedua copy- duanya dan personmenunjuk ke objek yang sama.
Contoh 1. Klon Objek Menggunakan 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);
Pengeluaran
(nama: "John", umur: 21) Peter John
The Object.assign()kaedah adalah sebahagian daripada ES6 standard. The Object.assign()Cara Melakukan mendalam salinan dan salinan semua sifat-sifat dari satu atau lebih objek.
Catatan : Kosong ()sebagai argumen pertama memastikan bahawa anda tidak mengubah objek asal.
Contoh 2: Klon Objek Menggunakan Sintaks Spread
// 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);
Pengeluaran
(nama: "John", umur: 21) Peter John
Sintaks spread … diperkenalkan dalam versi yang lebih baru (ES6).
Sintaks penyebaran boleh digunakan untuk membuat salinan objek yang cetek. Ini bermaksud ia akan menyalin objek. Walau bagaimanapun, objek yang lebih dalam dirujuk. Sebagai contoh,
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
Di sini, apabila nilai objek dalaman mathditukar kepada 100 daripada clonePersonobjek, nilai mathutama personobjek juga berubah.
Contoh 3: Klon Objek Menggunakan 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);
Pengeluaran
(nama: "John", umur: 21) Peter John
Dalam program di atas, JSON.parse()kaedah tersebut digunakan untuk mengklon objek.
Catatan : JSON.parse()hanya berfungsi dengan Numberdan Stringobjek secara literal. Ia tidak berfungsi dengan objek literal dengan functionatau symbolsifat.
