JavaScript Object: Özellikler, Metotlar ve Kullanımı

JavaScript Object Nedir?

Dizi (array), değerleri sıraya göre gruplar; object ise isme göre. Modellediğin şeyin etiketli parçaları varsa — mesela adı ve yaşı olan bir kullanıcı ya da metodu ve URL'si olan bir istek — doğru seçim object olur.

JavaScript object oluşturmanın en kısa yolu object literal kullanmaktır:

Her giriş bir key: value çiftidir. Anahtarlar aslında string'dir (geçerli bir tanımlayıcıysa, örneğin name, tırnak kullanmak zorunda değilsiniz). Değerler ise JavaScript'in ifade edebildiği her şey olabilir — sayı, string, boolean, dizi, fonksiyon, hatta başka bir object.

Son girişin ardından virgül bırakmak sorun değil. Çoğu ekip bunu bilerek bırakır; ileride yeni bir property eklediğinizde diff'ler daha temiz kalır.

Object özelliklerine erişim: okuma ve yazma

Bir property'ye erişmenin iki yolu var: nokta notasyonu ve köşeli parantez notasyonu.

Nokta notasyonu daha temiz durur ve çoğu zaman refleks olarak ona uzanırsın. Köşeli parantez notasyonu ise anahtar bir değişkende tutuluyorsa ya da anahtar geçerli bir tanımlayıcı değilse işe yarar:

Olmayan bir property'yi okumaya çalıştığınızda hata almazsınız, geriye undefined döner:

Bu durum, yazım hatalarını sessizce gizleyebilir. Hatanın sesli şekilde patlamasını istiyorsanız, kontrolü elle yapmanız gerekir.

Object'e Property Ekleme ve Silme

JavaScript object'leri esnek yapılardır; istediğiniz zaman yeni key ekleyebilirsiniz:

Ve delete ile silebilirsin:

delete her gün kullanacağınız bir operatör değil, ama bir key'i tamamen kaldırmak istediğinizde (sadece undefined yapmak değil) doğru araç bu. user.email = undefined yazarsanız key nesnede durmaya devam eder — "email" in user yine true döner.

Bir Property'nin Var Olup Olmadığını Kontrol Etme

Üç farklı yol var ve her birinin anlamı biraz farklı:

• in operatörü, prototype zincirinden miras alınanlar dahil olmak üzere anahtarın var olup olmadığını kontrol eder.
• Object.hasOwn(obj, key) ise yalnızca object'in kendi anahtarlarına bakar. Miras alınan şeyleri görmezden gelmek istediğinde bunu kullan. Eski hasOwnProperty çağrısının yerini alır.
• obj.key !== undefined çoğu zaman işe yarar ama bir property açıkça undefined olarak atandığında seni yanıltır.

Kararsız kaldığında Object.hasOwn'u tercih et — büyük ihtimalle kastettiğin şeyi yapar.

Metotlar: Object'in İçinde Yaşayan Fonksiyonlar

Değeri bir fonksiyon olan property'ye metot denir. Object literal içinde tanımlamak için kısa bir sözdizimi var:

Bir metot içindeki this, metodun çağrıldığı nesneyi ifade eder — bu örnekte user. greet'in hangi ismi kullanacağını bilmesinin sebebi de bu.

Dikkat edilmesi gereken bir nokta var: arrow function'ların kendilerine ait bir this'i yoktur. Bu yüzden, nesnenin başka özelliklerini okuması gereken metotlarda arrow function kullanmak yanlış bir tercih olur:

this kullanan her şeyde kısa metod söz dizimini (greet() { ... }) tercih et. Arrow function'lar callback'ler için harikadır ama object metodu olarak kullanılmamalı.

İç İçe Object'ler (Nested Objects)

Değerler de object olabilir, istediğin kadar derine inebilirsin:

İç içe bir özelliği okumak zincirleme şekilde çalışır — user.address.city. İşin can alıcı noktası şu: bu zincirdeki herhangi bir adım null ya da undefined olursa, elinize TypeError geçer:

console.log(user.profile.city);
// TypeError: Cannot read properties of undefined (reading 'city')

Optional chaining (user.profile?.city) bu sorunun modern çözümü: ara bir bağlantı eksik olduğunda hata fırlatmak yerine undefined döndürür. Bu konuyu bu bölümün ilerleyen sayfalarında ayrıntılı olarak ele alacağız.

Object İçinde Döngü Kurmak

Bir object'in tüm key'lerini dolaşmanız gerektiğinde Object.keys, Object.values ve Object.entries üçlüsü tam aradığınız şey:

Object.entries bunların içinde en kullanışlısı — sana anahtarı ve değeri aynı anda verdiği için dizi destructuring ile çok güzel uyum sağlıyor.

Bir de for...in döngüsü var ama bu miras alınan property'leri de dolaştığı için çoğu zaman istediğin şey bu olmuyor:

for (const key in scores) {
  console.log(key);  // çalışır, ancak miras alınan anahtarları da içerir
}

Kalıtsal özellikleri de almak istemiyorsan, Object.keys / Object.entries kullanmayı tercih et.

Bilmen Gereken Kısayol Söz Dizimleri

Her yerde karşına çıkacak iki tatlı söz dizimi kısayolu:

Property shorthand, değişken adı ile key aynı olduğunda devreye girer. Computed key'ler (yani [expr] kullanımı) ise property adlarını dinamik olarak üretmenize imkân tanır — bir field'ı adına göre güncelleyen fonksiyonlar yazarken çok işe yarar.

Object'lerde Eşitlik Referansa Göre Çalışır

Bu konu, herkesi en az bir kez yanıltır:

=== operatörü nesnelerde içerik değil, bellekteki aynı referansa işaret edip etmediklerini kontrol eder. Yani aynı property'lere sahip iki nesne, yine de birbirinden farklı iki nesnedir.

"Bu ikisinin yapısı aynı mı?" sorusunun cevabını bulmak için alanları tek tek karşılaştırman ya da bir deep-equality yardımcısı kullanman gerekir. JSON.stringify(a) === JSON.stringify(b) ise pratik ama kaba bir yöntem: düz verilerde işini görür, ancak içinde fonksiyon, undefined veya döngüsel referans olan nesnelerde çuvallar.

const ile Bile Object'ler Değiştirilebilir

const yalnızca değişkeni tek bir değere bağlar. O değerin işaret ettiği nesneyi dondurmaz:

Gerçekten değişmezlik (immutability) istiyorsan, Object.freeze(user) ile sonraki değişiklikleri engelleyebilirsin — ama bu yüzeyseldir, iç içe object'ler yine değişebilir. Pratikte çoğu kod Object.freeze yerine konvansiyona güvenir: const ile tanımlı object'leri "bu bağlamayı yeniden atama" şeklinde düşün, değişmezliği de tasarım seviyesinde çöz.

Sırada: Diziler

Object'ler ve diziler, diğer her şeyin üzerine kurulduğu iki temel yapı taşı. Object'ler etiketli veriyi tutar, diziler ise sıralı veriyi. Bir sonraki konu: JavaScript dizilerinin nasıl çalıştığı ve işin büyük kısmını halleden birkaç metot (push, slice, map ve arkadaşları).