Objek JavaScript - Pembekuan cetek lwn pembekuan dalam

Perbezaan antara pembekuan cetek dan pembekuan dalam terletak pada cara tingkah laku pembekuan digunakan pada objek bersarang. Berikut ialah pecahan dua konsep:

---

1. Pembekuan Cetek

• Definisi: Membekukan hanya sifat peringkat atas sesuatu objek.
• Tingkah Laku:
  • Menghalang menambah, mengalih keluar atau mengubah suai sifat peringkat teratas.
  • Tidak tidak membekukan objek bersarang; mereka kekal boleh berubah.
• Contoh:

const shallowObject = {
    name: "Alice",
    details: { age: 25, city: "New York" },
};

Object.freeze(shallowObject);

// Top-level properties are immutable
shallowObject.name = "Bob"; // Ignored
shallowObject.newProp = "test"; // Ignored

// Nested objects are still mutable
shallowObject.details.age = 30; // Allowed

console.log(shallowObject);
// Output: { name: "Alice", details: { age: 30, city: "New York" } }

---

2. Deep Freeze

• Takrif: Membekukan objek bersama-sama dengan semua objek dan tatasusunan bersarangnya, secara rekursif.
• Tingkah Laku:
  • Memastikan tiada bahagian objek (peringkat atas atau bersarang) boleh diubah suai.
• Contoh:

const deepObject = {
    name: "Alice",
    details: { age: 25, city: "New York" },
};

// Deep freeze function
function deepFreeze(object) {
    const propertyNames = Object.getOwnPropertyNames(object);
    for (const name of propertyNames) {
        const value = object[name];
        if (value && typeof value === 'object') {
            deepFreeze(value); // Recursively freeze
        }
    }
    return Object.freeze(object);
}

deepFreeze(deepObject);

// Neither top-level nor nested properties can be changed
deepObject.name = "Bob"; // Ignored
deepObject.details.age = 30; // Ignored

console.log(deepObject);
// Output: { name: "Alice", details: { age: 25, city: "New York" } }

---

Jadual Perbandingan

Ciri Pembekuan Cetek Deep Freeze

Feature	Shallow Freeze	Deep Freeze
Scope	Only freezes top-level properties.	Freezes top-level and nested objects.
Nested Object Mutability	Mutable.	Immutable.
Implementation	Object.freeze(object).	Custom recursive function with Object.freeze().
Example Mutation	Modifications to nested objects are allowed.	No modifications allowed at any level.

Skop Hanya membekukan sifat peringkat teratas. Membekukan objek peringkat atas dan bersarang. Mutability Objek Bersarang Boleh ubah. Tidak berubah. Pelaksanaan Object.freeze(objek). Fungsi rekursif tersuai dengan Object.freeze(). Contoh Mutasi Pengubahsuaian pada objek bersarang dibenarkan. Tiada pengubahsuaian dibenarkan pada mana-mana peringkat. table>

---

Kes Penggunaan

1. Pembekuan Cetek:

   • Sesuai apabila hanya sifat peringkat teratas yang perlu tidak berubah.
   • Contoh: Konfigurasi di mana sifat bersarang diurus secara bebas.

2. Pembekuan Dalam:

   • Sesuai apabila kebolehubah sepenuhnya diperlukan untuk keseluruhan hierarki objek.
   • Contoh: Memastikan konsistensi data untuk objek bersarang dalam dalam pengurusan keadaan.

Pertimbangan

• Prestasi:
  • Pembekuan dalam boleh menjadi mahal dari segi pengiraan untuk objek besar atau bersarang dalam.
• Rujukan Kitaran:
  • Jika objek mengandungi rujukan bulat, anda perlu menjejaki objek yang dilawati untuk mengelakkan rekursi tak terhingga.

Mengendalikan Rujukan Kitaran

Untuk mengendalikan rujukan kitaran, anda boleh mengekalkan WeakSet objek yang dilawati:

const shallowObject = {
    name: "Alice",
    details: { age: 25, city: "New York" },
};

Object.freeze(shallowObject);

// Top-level properties are immutable
shallowObject.name = "Bob"; // Ignored
shallowObject.newProp = "test"; // Ignored

// Nested objects are still mutable
shallowObject.details.age = 30; // Allowed

console.log(shallowObject);
// Output: { name: "Alice", details: { age: 30, city: "New York" } }

Ini menghalang rekursi tak terhingga untuk rujukan kitaran.

Atas ialah kandungan terperinci Objek JavaScript - Pembekuan cetek lwn pembekuan dalam. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!