JavaScript Dersleri

JavaScript’te Nesneler ve Dizilerin Birlikte Kullanımı

eminbasbayan

eminbasbayan

4 dk okuma
JavaScript’te Nesneler ve Dizilerin Birlikte Kullanımı
🔍 Büyütmek için tıklayın

Programlamada karşımıza en sık çıkan ihtiyaçlardan biri, verileri düzenli ve erişilebilir şekilde saklamaktır. JavaScript bu ihtiyacı karşılamak için bize iki güçlü araç sunar: diziler (arrays) ve nesneler (objects). Bu iki yapıyı ayrı ayrı öğrenmek önemlidir, ancak onları birlikte kullanmak, yazdığımız uygulamaları çok daha anlamlı ve esnek hale getirir.

Bu yazıda, yalnızca nesne ve dizi yapılarını birlikte nasıl kullandığımızı inceleyeceğiz. Konunun daha iyi anlaşılabilmesi için örneklerimiz sade ve gerçek hayattan uyarlanmış olacaktır.

Diziler ve Nesneler: Kısa Bir Hatırlatma

Dizi (Array): Sıralı verileri saklamak için kullanılır. Her elemanın bir indeks numarası vardır.

const kitaplar = ["Sefiller", "1984", "Kürk Mantolu Madonna"];

Bu örnekte üç kitap, sıralı olarak bir liste içinde tutuluyor.

Nesne (Object): Etiketli (anahtar-değer şeklinde) verileri saklar. Her verinin neye ait olduğu, açık bir şekilde belirtilmiştir.

const kitap = { ad: "Sefiller", yazar: "Victor Hugo", sayfaSayisi: 1232 };

Burada kitapla ilgili bilgiler, etiketleriyle birlikte tutuluyor.

Dizi İçinde Nesne: Uygulamalarda Sık Karşımıza Çıkan Yapı

Diyelim ki bir kitap satış sitesinde sepet özelliği geliştiriyoruz. Sepette birden fazla kitap olabilir ve her kitapla ilgili bilgiler (ad, fiyat, miktar gibi) tutulmalıdır. Bu durumda dizi içinde nesne yapısı kullanılır:

const sepet = [ { ad: "Sefiller", fiyat: 89.9, adet: 1 }, { ad: "Beyaz Diş", fiyat: 34.5, adet: 2 } ];

Bu yapı sayesinde, her kitap ayrı bir nesne olarak saklanır ve sıralı şekilde dizide yer alır. Böylece kullanıcı sepetine yeni kitap ekledikçe liste genişler.

Örnek Sorgulama:

İkinci kitabın adını almak istersek:

console.log(sepet[1].ad); // "Beyaz Diş"

Nesne İçinde Dizi veya Başka Nesneler: Detaylı Bilgi Tutmak

Nesneler sadece basit veri tutmaz; içinde başka diziler veya nesneler de saklayabilir. Bu özellikle bir varlığa (örneğin bir kullanıcıya) ait birden fazla bilgi olduğunda işimize yarar.

const ogrenci = { isim: "Zeynep", hobiler: ["satranç", "yüzme", "resim"], notlar: { matematik: 85, tarih: 92 } };

Burada:

  • hobiler bir dizidir. Öğrencinin ilgi alanlarını tutar.
  • notlar başka bir nesnedir. Ders ve not bilgilerini içerir.

Örnek Sorgulama:

Tarih notuna ulaşmak:

console.log(ogrenci.notlar.tarih); // 92

Gerçek Hayattan İlham Alan Yapılar: Forum Yorumları

Forum, blog veya sosyal medya platformlarında bir gönderiye birden fazla yorum yapılabilir. Bu yorumlar, kullanıcı adı, yorum metni ve beğeni sayısı gibi bilgileri içerebilir. Bu veriyi şu şekilde tutabiliriz:

const yorumlar = [ { kullanici: "Ahmet123", yazi: "Makale çok açıklayıcıydı, teşekkürler!", begeni: 12 }, { kullanici: "kitapkurdu", yazi: "Bence örnekler daha da geliştirilebilir.", begeni: 5 } ];

Bu yapı sayesinde:

  • Her yorum nesne olarak tanımlanır.
  • Yorumlar dizi içinde sırayla yer alır.

İkinci yorumun metnine ulaşmak:

console.log(yorumlar[1].yazi); // "Bence örnekler daha da geliştirilebilir."

Daha Karmaşık Yapılar: Gerçek Uygulamalarda Nelerle Karşılaşırız?

İnternetteki büyük sitelerin (örneğin haber siteleri, e-ticaret platformları ya da sosyal ağlar) veri yapıları genelde oldukça karmaşıktır. Bunun nedeni, kullanıcılar, gönderiler, yorumlar, resimler, beğeniler gibi çok fazla farklı türde verinin bir arada tutulmasıdır.

Örneğin bir gönderinin yapısı şu şekilde olabilir:

const gonderi = { baslik: "JavaScript'te Nesne Kullanımı", yazar: "coderay", yorumlar: [ { kullanici: "elifdev", yazi: "Çok faydalı olmuş.", oy: 8 }, { kullanici: "mehmetintech", yazi: "JSON yapısına da değinebilir misiniz?", oy: 3 } ], etiketler: ["javascript", "nesne", "dizi"], goruntulenme: 542 };

Burada:

  • yorumlar alanı, dizi içinde nesnelerden oluşuyor.
  • etiketler bir dizi.
  • Diğer alanlar metin veya sayısal değer içeriyor.

Böyle yapılar sayesinde gerçek hayattaki karmaşık bilgiler düzenli bir şekilde program içinde tutulabilir.

Sonuç: Nesne ve Dizi İş Birliği

Gerçek dünyadaki verilerin büyük çoğunluğu, hem sıralı hem de etiketli özellikler taşır. Bu nedenle JavaScript’te diziler ve nesneler birlikte kullanılarak veriler anlamlı ve düzenli hale getirilir.

Bu yazıda sadece bu yapıları birlikte kullanma konusuna odaklandık:

  • Dizi içinde nesne (yorum listesi, ürün sepeti vb.)
  • Nesne içinde dizi veya başka nesneler (kullanıcı bilgisi, öğrenci notları vb.)
  • Gerçek uygulamalarda iç içe geçmiş yapılarla karşılaşmanın doğal ve gerekli olduğu

Bu kavramları iyi kavrayan biri, gerçek projelerdeki veri yapılarıyla çok daha rahat çalışabilir. Ezber yapmaya gerek yok, önemli olan mantığını kavramak ve bol bol alıştırma yapmak.

Etiketler

#Eğitimler#JavaScript Dersleri

İlgili Yazılar

Bu konuyla ilgili diğer yazılarımızı da inceleyebilirsiniz

Web Geliştirmede Neden JavaScript'e İhtiyacımız Var?
JavaScript Dersleri

Web Geliştirmede Neden JavaScript'e İhtiyacımız Var?

Web geliştirme, temel olarak üç ana yapı taşı üzerine kuruludur: **HTML, CSS ve JavaScript**. Bu üçlüden **HTML**, sayfanın iskeletini oluşturur, **CSS**, tasarımı ve görsel düzenlemeleri yapar

2 dk
JavaScript'e Giriş: JavaScript Nedir?
JavaScript Dersleri

JavaScript'e Giriş: JavaScript Nedir?

Web geliştirme yolculuğunuzda büyük bir adım atıyorsunuz! HTML ve CSS ile statik web sayfaları oluşturmayı öğrendiniz, ancak şimdi JavaScript ile sayfanıza hareket ve etkileşim katmanını eklemeye hazırsınız. JavaScript, web sayfalarını dinamik hale getiren ve kullanıcı etkileşimlerini yöneten

3 dk
JavaScript Değişkenler (Variables) Nedir?
JavaScript Dersleri

JavaScript Değişkenler (Variables) Nedir?

JavaScript, web geliştirme dünyasının en önemli dillerinden biridir. Dinamik web siteleri, interaktif uygulamalar, oyunlar ve animasyonlar gibi birçok alanda kullanılır. Ancak, bu tür gelişmiş uygulamalar oluşturabilmek için önce JavaScript'in temellerini anlamak gerekir. Bu

4 dk
JavaScript İlkel (Primitive) Veri Tipleri
JavaScript Dersleri

JavaScript İlkel (Primitive) Veri Tipleri

JavaScript, modern web geliştirmede vazgeçilmez bir programlama dilidir. Web sitelerini daha dinamik hale getirmek, etkileşim eklemek ve hatta oyunlar ve uygulamalar geliştirmek için kullanılır. Ancak, bu eğlenceli ve güçlü özelliklere ulaşmadan önce, JavaScript'in temellerin

4 dk
JavaScript'te Sayılar ve Matematiksel Operatörler
JavaScript Dersleri

JavaScript'te Sayılar ve Matematiksel Operatörler

JavaScript, modern web geliştirmede en yaygın kullanılan programlama dillerinden biridir. Bu dilde çalışırken sayılarla sıkça işlem yaparız. İster bir hesap makinesi uygulaması geliştiriyor olun, ister bir oyundaki puan sistemini kodluyor olun, sayılar kaçınılmaz bir parçadır. JavaScri

4 dk
JavaScript'te Boolean Veri Tipi
JavaScript Dersleri

JavaScript'te Boolean Veri Tipi

JavaScript'ı öğrenmeye yeni başlayanlar için veri tipleri oldukça önemlidir. Bu yazıda, en temel veri tiplerinden biri olan **Boolean (mantıksal) değerleri** inceleyeceğiz. Boolean değerleri, programlamada sıklıkla kullanılan ve kodlarımızın man

3 dk