Yükleniyor...

JavaScript nesneleri

Fonksiyon ve closure biliyorsunuz; mantığı toplayabilirsiniz. Gerçek sayfalar yapılandırılmış veri de ister: bir ürünün başlığı, fiyatı ve stoğu birlikte durur. Nesne (object) birkaç adlı parçayı tutan tek bir değerdir.

Nesne ne demek

Nesne ilişkili veriyi özellik (property) olarak saklar. Her özelliğin bir anahtar (key) — ad — ve bir değer (value) vardır. Başlangıçta çoğu zaman nesne literali yazılır: süslü parantez { } ve içinde anahtar: değer çiftleri. Bu ilk adım için sınıf gerekmez.

Bakılacak dört parça

📊 Literal, anahtar, değer ve erişim

Parça Rol Yeni başlayan ipucu
nesne literali değişkene atadığınız { … } değeri ilişkili verinin bir torbası
anahtar : solundaki özellik adı parçayı nasıl etiketlersiniz
değer : sağındaki veri dize, sayı, boolean, …
erişim . veya [ ] ile okuma/yazma sonra bir parçaya nasıl ulaşırsınız

Bu dördü gösterebilirseniz, neredeyse her ilk nesne örneğini anlatırsınız. Çoğu için sürpriz süslü parantez değil — bir değişkenin artık birkaç adlı alanı taşımasıdır.

Küçük bir nesne literali

javascript 
let book = {
title: "Maps",
pages: 120
};
console.log(book);

Süslü parantez nesneyi kurar

book tek bir değerdir. İçinde title ve pages özelliktir. Çiftleri virgül ayırır. } sonrası nesne kullanıma hazırdır. book yazdırmak konsolda tüm torbayı gösterir.

Nokta notasyonuyla okuma

javascript 
let book = {
title: "Maps",
pages: 120
};
console.log(book.title);
console.log(book.pages);

Nokta bir alana ulaşır

Nesne adı, nokta, sonra anahtar: book.title. Sonuç "Maps" dizesidir. Bilinen bir özellik adını okumanın günlük yolu noktadır. Bu biçimde anahtar geçerli bir tanımlayıcıya benzemelidir.

Köşeli parantezle okuma

javascript 
let book = {
title: "Maps",
pages: 120
};
console.log(book["title"]);
console.log(book["pages"]);

Köşeli parantez de aynı alana ulaşır

Burada book["title"], book.title ile aynı değerdir. Köşeli parantez bir dize (veya anahtar olan bir ifade) alır. Anahtar değişkendeyse veya ad basit tanımlayıcı değilse kullanın. Sabit adlarda nokta genelde daha nettir.

Oluşturduktan sonra özelliği değiştirin

javascript 
let book = {
title: "Maps",
pages: 120
};
book.pages = 140;
console.log(book.pages);

Özelliği sonra da güncelleyebilirsiniz

book.pages ataması o alanı değiştirir. Nesne aynı torba kalır; içindeki bir değer yenidir. Yeniden okuyunca 140 görürsünüz. Sonraki dersler özellik ekleme ve listelemeyi derinleştirir — burada amaç net bir ilk güncellemedir.

İki alan, bir nesne

javascript 
let item = {
name: "Mug",
price: 8
};
console.log(item.name);
console.log(item.price);

İlişkili alanlar birlikte yolculuk eder

name ve price bir mağaza ürününü anlatır. Onları bir nesnede tutmak, ayrışabilen iki ayrı globalden iyidir. item’ı bir fonksiyona verdiğinizde veya sayfaya koyduğunuzda iki alan bir birim gibi hareket eder.

Nesne alanını sayfada gösterin

Küçük bir ürün nesnesi kurun, bir özelliği okuyun ve o metni bir paragrafa koyun.

Nesneyle sayfa demosu

html 
<!DOCTYPE html>
<html>
<head>
<title>objects — page</title>
</head>
<body>
<p id="label">…</p>
<script>
let item = {
name: "Lamp",
price: 25
};
let box = document.getElementById("label");
box.textContent = item.name + " — " + item.price;
</script>
</body>
</html>

Paragraf Lamp — 25 gösterir. Yalnızca nesnenin name veya price değerini değiştirin, yenileyin, yeni satırı okuyun. Sırada nesne özellikleri daha derin gelir — anahtarların davranışı ve günlük iş.

Alıştırma adımları

  1. Literal ile iki özellikli bir nesne oluşturun.
  2. Bir özelliği nokta ile konsola yazdırın.
  3. Aynı özelliği köşeli parantez ve dize anahtarla yazdırın.
  4. Bir özelliği değiştirip yeni değeri okuyun.
  5. name ve price olan bir item kurun; iki alanı yazdırın.
  6. HTML demosunda yalnızca nesne değerlerini değiştirin, yenileyin, paragrafı okuyun.

Sık yapılan hatalar

  • Nesneyi numaralı liste gibi görmek (bu daha çok diziye yakındır; kursta sonra)
  • Dize değerlerde tırnak unutmak — tırnaksız title: Maps yanlıştır
  • Literali anlatırken anahtar ile değeri karıştırmak
  • Bu ilk sayfada metot, this veya derin özellik araçları beklemek — onlar sonra gelir
  • Her alan için ayrı global açmak yerine tek nesne kullanmamak

Özet

  • Nesne ilişkili değerleri adlı özellikler olarak toplar
  • Literal biçimi { anahtar: değer, … }
  • Nokta notasyonu (obj.key) bilinen özelliği okur
  • Köşeli parantez (obj["key"]) dize anahtarla okur
  • Özelliğe atayarak sonra güncelleyebilirsiniz
  • Nesne taşınırken ilişkili alanlar birlikte kalır
  • Sayfa güncellemeleri nesne alanlarından dize kurabilir
  • Sonraki: nesne özellikleri — anahtarlarla daha derin çalışma

🧠 Bilginizi Test Edin

Başlamaya Hazır

Bilginizi Test Edin

Bu interaktif sınavla kendini test et ve konuyu ne kadar iyi anladığını gör

❓
8
Sorular
🎯
70%
Geçmek İçin
♾️
∞
Süre
🔄
∞
Deneme

📝 Talimatlar

  • Her soruyu dikkatle okuyun
  • Her soru için en iyi cevabı seçin
  • Quiz'i istediğiniz kadar tekrar alabilirsiniz
  • İlerlemeniz üstte gösterilecek
Konu 33 / 33
Javascript Ders