Object: Manipulasi Properti

Tambah & Ubah: Object Itu Fleksibel

Tidak seperti di banyak bahasa lain, object JavaScript bisa ditambah propertinya kapan saja setelah dibuat:

const user = { nama: "Budi" };
user.umur = 17;     // tambah properti baru
user.nama = "Andi"; // ubah yang sudah ada
user["kota"] = "Bandung"; // bracket juga bisa untuk assignment
console.log(user); // { nama: "Andi", umur: 17, kota: "Bandung" }

Fleksibilitas ini yang membuat object cocok untuk data dinamis: profil user yang dilengkapi bertahap, atau object hasil yang dirakit dari beberapa sumber.

Hapus dengan delete

const user = { nama: "Andi", umur: 17, rahasia: "xxx" };
delete user.rahasia;
console.log(user); // { nama: "Andi", umur: 17 }

Kasus nyata: menghapus field sensitif (password, token) dari object user sebelum dikirim ke client atau dicatat ke log. Tapi ingat: delete hanya menghapus properti object, tidak bisa menghapus variabel biasa. Dan untuk sekadar "mengosongkan" nilai, assign undefined atau null saja, tidak perlu delete.

Introspeksi: keys, values, entries

Kadang kamu menerima object yang key-nya tidak kamu ketahui sebelumnya, misalnya respons API. Tiga method static Object.* ini adalah senternya:

const config = { host: "localhost", port: 3000, ssl: true };
Object.keys(config);   // ["host", "port", "ssl"]
Object.values(config); // ["localhost", 3000, true]
Object.entries(config); // [["host","localhost"], ["port",3000], ["ssl",true]]

Object.entries paling enak untuk loop karena memberi key dan value sekaligus (plus destructuring):

for (const [k, v] of Object.entries(config)) {
  console.log(k + " = " + v);
}
// host = localhost
// port = 3000
// ssl = true

Contoh nyata kedua, menghitung total stok dari object inventaris yang itemnya bisa bertambah kapan saja:

const stok = { kopi: 10, teh: 5, roti: 20 };
const total = Object.values(stok).reduce((a, b) => a + b, 0);
console.log(total); // 35

Tanpa Object.values, kamu harus tahu semua nama item dulu. Dengan ini, kode tetap jalan walau besok ada 50 item baru.

Cek Keberadaan Properti

const user = { nama: "Andi" };
"nama" in user;               // true
"umur" in user;               // false
user.hasOwnProperty("nama");  // true

Bedanya: in juga menemukan properti warisan dari prototype (misalnya "toString" in user itu true!), sedangkan hasOwnProperty hanya properti milik sendiri. Untuk validasi data ("apakah field wajib ini ada?"), hasOwnProperty lebih tepat. Alternatif modern yang aman: Object.hasOwn(user, "nama").

Contoh Nyata: Membersihkan Data Form Sebelum Dikirim

Kasus paling sering di aplikasi nyata: object form berisi field sensitif yang tidak boleh dikirim ke server atau tercatat di log.

const form = { nama: "Budi", umur: 17, password: "rahasia123", token: "abc" };

// Cara 1: delete satu per satu (memutasi object form)
delete form.password;
delete form.token;

// Cara 2: rest destructuring, object asli tetap utuh
const { password, token, ...aman } = form;
kirimKeServer(aman); // { nama: "Budi", umur: 17 }

Cara 2 lebih disukai di kode modern karena tidak merusak data asli: kalau pengiriman gagal dan user perlu mengulang, field password-nya masih ada. Pola "ambil yang dibutuhkan, sisanya buang" ini juga dipakai untuk memisahkan field tampilan dari field internal sebelum data disimpan ke database.

Jebakan Umum

Mengira delete membuat object "lebih ringan" secara performa. Di engine modern, delete bisa membuat object keluar dari "hidden class" yang teroptimasi dan justru memperlambat akses properti di hot path. Untuk object yang sering diakses dalam loop besar, lebih baik set nilainya null/undefined daripada delete. Untuk kasus biasa, abaikan saja.

Iterasi dengan for...in tanpa filter. for...in mengiterasi properti warisan juga. Kalau memang harus pakai for...in, selalu saring dengan hasOwnProperty. Atau lebih aman: pakai Object.keys()/Object.entries() + for...of seperti contoh di atas.

Catatan teknis: Object.keys/values/entries hanya memproses properti enumerable milik sendiri, dan mengabaikan key bertipe Symbol. Urutannya: key integer menaik dulu, lalu string sesuai urutan sisip. Object.freeze(obj) bisa mengunci object agar tidak bisa tambah/ubah/hapus, berguna untuk konstanta konfigurasi.