Fahami Rujukan dan Penyalinan Objek JavaScript - Penjelasan Ringkas

Apabila bekerja dengan objek dalam JavaScript, memahami perbezaan antara rujukan objek dan penyalinan objek adalah penting. Berikut ialah gambaran keseluruhan terperinci:

---

Rujukan Objek

1. Objek ialah jenis rujukan:
   • Apabila anda menetapkan objek kepada pembolehubah, anda memberikan rujukan kepada lokasi memori tempat objek disimpan, bukan salinan objek itu sendiri.
   • Mengubah suai objek melalui satu rujukan memberi kesan kepada semua rujukan kepada objek yang sama.

   let obj1 = { name: "Alice" };
   let obj2 = obj1; // obj2 now references the same object as obj1
   obj2.name = "Bob";
   console.log(obj1.name); // Output: "Bob"

1. Semakan kesaksamaan:
   • Dua pembolehubah adalah sama jika mereka merujuk objek yang sama dalam ingatan, bukan jika kandungannya adalah sama.

   let a = { key: "value" };
   let b = { key: "value" };
   console.log(a === b); // Output: false (different references)
   let c = a;
   console.log(a === c); // Output: true (same reference)

---

Menyalin Objek

Terdapat dua jenis penyalinan objek utama: salinan cetek dan salinan dalam.

1. Salinan Cetek

• Salinan cetek mencipta objek baharu, tetapi ia hanya menyalin tahap pertama sifat. Objek atau tatasusunan bersarang masih dirujuk, bukan pendua.

Teknik untuk Salinan Cetek:

• Object.assign():
  

   let original = { name: "Alice", details: { age: 25 } };
   let copy = Object.assign({}, original);
   copy.details.age = 30;
   console.log(original.details.age); // Output: 30 (shared reference)
  

• Pengendali sebaran (...):
  

   let original = { name: "Alice", details: { age: 25 } };
   let copy = { ...original };
   copy.details.age = 30;
   console.log(original.details.age); // Output: 30 (shared reference)
  

• Kedua-dua kaedah mencipta salinan cetek, bermakna objek bersarang masih dipautkan.

2. Salinan Dalam

• Salinan dalam menduplikasi keseluruhan objek, termasuk struktur bersarang. Objek baharu adalah bebas sepenuhnya daripada objek asal.

Teknik untuk Salinan Dalam:

• JSON.parse() dan JSON.stringify():
  

   let original = { name: "Alice", details: { age: 25 } };
   let copy = JSON.parse(JSON.stringify(original));
   copy.details.age = 30;
   console.log(original.details.age); // Output: 25
  

  • Penghadan: Kaedah ini tidak mengendalikan fungsi, tidak ditentukan, Infiniti atau objek khas seperti Tarikh atau RegExp.

• StructuredClone() (JavaScript Moden):
  

   let original = { name: "Alice", details: { age: 25 } };
   let copy = structuredClone(original);
   copy.details.age = 30;
   console.log(original.details.age); // Output: 25
  

  • Kaedah ini mengendalikan kebanyakan kes tepi (cth., rujukan bulat) tetapi tidak disokong dalam persekitaran yang lebih lama.

• Perpustakaan Tersuai:

  • Gunakan perpustakaan seperti lodash:

     let obj1 = { name: "Alice" };
     let obj2 = obj1; // obj2 now references the same object as obj1
     obj2.name = "Bob";
     console.log(obj1.name); // Output: "Bob"
  

---

Jadual Ringkasan

Action	Result
Assignment (=)	Creates a reference. Changes to one variable affect the other.
Shallow Copy	Creates a new object but retains references for nested objects.
Deep Copy	Creates a completely independent object, including nested structures.

Tindakan

Hasil

Tugasan (=) Mencipta rujukan. Perubahan kepada satu pembolehubah mempengaruhi yang lain. Salinan Cetek Mencipta objek baharu tetapi mengekalkan rujukan untuk objek bersarang. Salinan Dalam Mencipta objek bebas sepenuhnya, termasuk struktur bersarang.

Memahami konsep ini membantu anda mengelakkan kesan sampingan yang tidak diingini apabila bekerja dengan objek dalam JavaScript!

Atas ialah kandungan terperinci Fahami Rujukan dan Penyalinan Objek JavaScript - Penjelasan Ringkas. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!