JavaScript Academy · Pelajaran

Object.freeze dan seal

Cegah perubahan pada objek.

Object.freeze dan seal adalah pelajaran JavaScript Academy gratis di CoddyKit. Ini adalah pelajaran 1 dari 4. Kamu bisa membaca pelajaran lengkapnya di bawah secara gratis — lalu praktikkan langsung di browser dengan editor kode bawaan dan tutor AI 24/7. Ini adalah bagian dari jalur belajar JavaScript Academy, dan progresmu tersinkronisasi di web dan aplikasi CoddyKit. Kursus JavaScript Academy mencakup 4 pelajaran total.

Mengapa Menggunakan freeze pada Objek?

Imutabilitas berarti data tidak dapat berubah setelah dibuat. Hal ini mencegah perubahan yang tidak disengaja, membuat kode lebih mudah dipahami, dan menghindari berbagai jenis bug.

JavaScript menyediakan Object.freeze dan Object.seal untuk mengunci objek.

Dasar-Dasar Object.freeze

Object.freeze membuat objek sepenuhnya hanya-baca: Anda tidak dapat menambahkan, menghapus, atau mengubah properti. Fungsi ini mengembalikan objek yang sama, yang kini frozen.

const user = Object.freeze({ name: 'Ada', age: 36 });
user.age = 99;
console.log(user.age);

Memeriksa dengan isFrozen

Object.isFrozen memberi tahu apakah sebuah objek frozen. Ini berguna sebelum mencoba melakukan pembaruan.

const config = Object.freeze({ debug: false });
const settings = { theme: 'dark' };

console.log(Object.isFrozen(config));
console.log(Object.isFrozen(settings));

Kegagalan Diam-Diam dan Ketat

Dalam kode non-strict, penulisan ke objek frozen gagal secara diam-diam. Dalam mode strict, penulisan tersebut melempar TypeError. Bagaimanapun, nilainya tidak pernah berubah.

'use strict';
const frozen = Object.freeze({ x: 1 });
try {
  frozen.x = 2;
} catch (e) {
  console.log(e.name);
}
console.log(frozen.x);

freeze Mencegah Properti Baru

freeze juga mencegah penambahan properti. key baru tersebut tidak muncul sama sekali.

const point = Object.freeze({ x: 0 });
point.y = 5;
console.log(point.y);
console.log(Object.keys(point));

freeze Mencegah Penghapusan

Anda juga tidak dapat menghapus properti dari objek frozen. Properti tersebut tetap ada.

const obj = Object.freeze({ keep: 'me' });
delete obj.keep;
console.log(obj.keep);

Object.seal Berbeda

Object.seal tidak seketat freeze. Anda tidak dapat menambahkan atau menghapus properti, tetapi Anda masih dapat mengubah nilai yang sudah ada.

const sealed = Object.seal({ count: 1 });
sealed.count = 2;
sealed.extra = 3;

console.log(sealed.count);
console.log(sealed.extra);

Memeriksa dengan isSealed

Object.isSealed melaporkan apakah sebuah objek sealed. Perhatikan bahwa setiap objek frozen juga sealed, tetapi tidak berlaku sebaliknya.

const sealed = Object.seal({ a: 1 });
const frozen = Object.freeze({ b: 2 });

console.log(Object.isSealed(sealed));
console.log(Object.isSealed(frozen));
console.log(Object.isFrozen(sealed));

Ringkasan freeze versus seal

freeze: tidak dapat menambah, menghapus, atau mengubah. seal: tidak dapat menambah atau menghapus, tetapi perubahan diizinkan. Pilih seal ketika bentuk objek sudah tetap, tetapi nilainya masih berkembang.

const f = Object.freeze({ v: 1 });
const s = Object.seal({ v: 1 });

f.v = 100;
s.v = 100;

console.log('frozen v:', f.v);
console.log('sealed v:', s.v);

preventExtensions

Kunci yang paling longgar adalah Object.preventExtensions: Anda tidak dapat menambahkan properti, tetapi masih dapat mengubah dan menghapus properti yang sudah ada. Ini adalah yang paling lemah dari ketiganya.

const obj = Object.preventExtensions({ a: 1 });
obj.a = 2;
obj.b = 3;

console.log(obj.a);
console.log(obj.b);
console.log(Object.isExtensible(obj));

Mengapa Ini Penting

Membekukan konfigurasi dan konstanta mencegah perubahan yang tidak disengaja di seluruh basis kode. Namun, ingat: Object.freeze bersifat dangkal, sehingga objek bertingkat tetap dapat diubah. Anda akan memperbaikinya berikutnya.

const SETTINGS = Object.freeze({ maxRetries: 3 });
function tryUpdate() {
  SETTINGS.maxRetries = 10;
}
tryUpdate();
console.log(SETTINGS.maxRetries);

Pemeriksaan Singkat

Apa perbedaan antara Object.freeze dan Object.seal?

Rangkuman: freeze dan seal

Anda telah mempelajari cara mengunci objek:

Object.freeze: tidak dapat menambah, menghapus, atau mengubah. Periksa dengan isFrozen.
Object.seal: tidak dapat menambah atau menghapus, tetapi perubahan diizinkan.
preventExtensions: hanya mencegah penambahan.
Ketiganya bersifat dangkal, sehingga kita akan membahas deepFreeze berikutnya.

Pertanyaan yang Sering Diajukan

Apakah pelajaran “Object.freeze dan seal” gratis?

Ya — teks lengkap “Object.freeze dan seal” gratis dibaca di sini di web. Untuk praktiknya secara interaktif (editor kode bawaan dan tutor AI 24/7) dan buka sisa kursus JavaScript Academy, upgrade ke CoddyKit PRO. Kursus JavaScript Academy mencakup 4 pelajaran total.

Apa yang akan aku pelajari di “Object.freeze dan seal”?

Cegah perubahan pada objek. Kamu berlatih JavaScript Academy dengan kode praktik yang langsung kamu jalankan di browser, dan tutor AI 24/7 menjawab pertanyaanmu saat kamu mengerjakan pelajaran ini.

Apakah aku perlu pengalaman untuk memulai JavaScript Academy?

Tidak diperlukan pengalaman sebelumnya. JavaScript Academy di CoddyKit dirancang untuk pemula hingga pelajar tingkat lanjut, jadi kamu bisa memulai di sini atau dari awal dan belajar sesuai kecepatan kamu sendiri. Ini adalah pelajaran 1 dari 4.

Berapa lama pelajaran “Object.freeze dan seal” memakan waktu?

Sebagian besar pelajaran CoddyKit memakan waktu sekitar 5–10 menit. Setiap pelajaran ringkas dan interaktif, jadi kamu membuat kemajuan stabil dan melanjutkan dari tempat kamu tinggalkan di web dan aplikasi.

Bisakah aku menulis dan menjalankan kode dalam pelajaran JavaScript Academy ini?

Ya. Setiap pelajaran JavaScript Academy menyertakan editor kode bawaan, jadi kamu menulis dan menjalankan kode nyata langsung di browser dan mendapatkan umpan balik AI instan — tidak diperlukan penyiapan lokal.

Semua pelajaran dalam kursus ini

← Kembali ke JavaScript Academy