JavaScript Array (Dizi) Metotları - Uygulamalı Anlatım

Ξεκίνησε από Unraz, Αυγ 12, 2024, 01:52 ΜΜ

« προηγούμενο - επόμενο »
Εκτύπωση
Κάτω Σελίδες1
Ενέργειες χρήστη

Unraz

Αυγ 12, 2024, 01:52 ΜΜ Τελευταία τροποποίηση: Νοε 16, 2024, 02:16 ΜΜ από Unraz
JavaScript Nedir?
JavaScript, web tarayıcılarında çalışan ve dinamik içerik oluşturmak için en çok kullanılan programlama dillerinden biridir. Hem istemci tarafında hem de sunucu tarafında (Node.js gibi) kullanılabilir. JavaScript, kullanıcı etkileşimlerini yönetme, içerik güncelleme ve uygulama geliştirme konularında büyük bir esneklik sunar. Yani, modern webin yüzü hâline gelmiştir!

Dizi Nedir?
JavaScript'te dizi, birden fazla veri parçasını saklamak için kullanılan bir veri yapısıdır. Diziler, sıralı öğeler listesidir ve her bir öğe, bir indeksle (sıfırdan başlayan sayılar) belirlenir. Basit bir örnek vermek gerekirse, bir meyve sepetini düşünün: Elma, muz ve portakal, her biri farklı konumlarla bir arada tutulur.

Dizi Türleri
JavaScript'te iki ana dizi türü vardır:
  • Tek Boyutlu Diziler: Sadece tek bir sıra boyunca sıralanmış elemanlardan oluşur.
  • Çok Boyutlu Diziler: İçinde başka diziler barındırabilen dizilerdir. Örneğin, bir matris gibi.

JavaScript Dizileri ile Çalışmaya Giriş
JavaScript'te dizilerle çalışmak oldukça kolaydır. Önce bir dizi oluşturmak ve daha sonra bu dizi üzerinde işlem yapmak için birkaç temel bilgiye ihtiyaç var.

Dizi Oluşturma
Dizi oluşturmak için, köşeli parantezler
Κώδικας [Επιλογή]
[] kullanabiliriz. Basit bir dizi nasıl tanımlanır bakalım:
Κώδικας [Επιλογή]
1let meyveler = ['elma', 'muz', 'portakal'];
2

Burada
Κώδικας [Επιλογή]
meyveler adında bir dizi tanımladık.

Farklı Yöntemlerle Dizi Oluşturma
Dizileri oluşturmanın birkaç farklı yolu vardır. Örneğin:
Κώδικας [Επιλογή]
1let sayilar = new Array(1, 2, 3, 4); // Array constructor kullanarak
2

Bu şekilde de diziler tanımlanabilir, ancak en yaygın yöntem köşeli parantez kullanmaktır.

Yaygın Dizi Metotları
JavaScript dizilerinin sunduğu birçok yararlı metod vardır. Şimdi bu metodları inceleyelim.

push() Metodu
Κώδικας [Επιλογή]
push() metodu, dizinin sonuna yeni bir eleman eklemeye yarar. Örneğin:
Κώδικας [Επιλογή]
1meyveler.push('kivi');
2console.log(meyveler); // Çıktı: ['elma', 'muz', 'portakal', 'kivi']
3

Bu metot diziyi değiştirdiği için, oranı artırır.

pop() Metodu
Κώδικας [Επιλογή]
pop() metodu, dizinin sonundaki elemanı çıkarır. Bu işlem dizinin sonundaki öğeyi silerken, silinen öğeyi de döndürür:
Κώδικας [Επιλογή]
1let sonMeyve = meyveler.pop();
2console.log(sonMeyve); // Çıktı: 'kivi'
3console.log(meyveler); // Çıktı: ['elma', 'muz', 'portakal']
4

shift() Metodu
Κώδικας [Επιλογή]
shift() metodu, dizinin en başındaki elemanı çıkarır. Oldukça kullanışlıdır, örneğin:
Κώδικας [Επιλογή]
1let ilkMeyve = meyveler.shift();
2console.log(ilkMeyve); // Çıktı: 'elma'
3console.log(meyveler); // Çıktı: ['muz', 'portakal']
4

unshift() Metodu
Κώδικας [Επιλογή]
unshift() metodu, dizinin başına yeni bir eleman ekler:
Κώδικας [Επιλογή]
1meyveler.unshift('şeftali');
2console.log(meyveler); // Çıktı: ['şeftali', 'muz', 'portakal']
3

splice() Metodu
Κώδικας [Επιλογή]
splice() metodu, belirli bir konumda elemanları silmenizi veya eklemenizi sağlar. Oldukça esnektir:
Κώδικας [Επιλογή]
1meyveler.splice(1, 1, 'vişne'); // 1. indeksden başlayarak bir öğe siler ve yerine 'vişne' ekler
2console.log(meyveler); // Çıktı: ['şeftali', 'vişne', 'portakal']
3

slice() Metodu
Κώδικας [Επιλογή]
slice() metodu, bir dizinin belirli bir bölümünü kopyalar ve yeni bir dizi döndürür:
Κώδικας [Επιλογή]
1let yeniMeyveler = meyveler.slice(1, 3); // 1. ve 3. indeks arası
2console.log(yeniMeyveler); // Çıktı: ['vişne', 'portakal']
3

forEach() Metodu
Κώδικας [Επιλογή]
forEach() metodu, dizinin her bir elemanı üzerinde işlem yapmanızı sağlar:
Κώδικας [Επιλογή]
1meyveler.forEach(function(meyve) {
2    console.log(meyve);
3});
4// Çıktı:
5// şeftali
6// vişne
7// portakal
8

map() Metodu
Κώδικας [Επιλογή]
map() metodu, her elemanı bir işleme tabi tutup, yeni bir dizi döndürür:
Κώδικας [Επιλογή]
1let uzunMeyveIsimleri = meyveler.map(function(meyve) {
2    return meyve + ' meyvesi';
3});
4console.log(uzunMeyveIsimleri);
5// Çıktı:
6// ['şeftali meyvesi', 'vişne meyvesi', 'portakal meyvesi']
7

filter() Metodu
Κώδικας [Επιλογή]
filter() metodu, belirli bir koşula uyan elemanları filtreleyerek yeni bir dizi döndürür:
Κώδικας [Επιλογή]
1let filtreliMeyveler = meyveler.filter(function(meyve) {
2    return meyve.includes('ş');
3});
4console.log(filtreliMeyveler); // Çıktı: ['şeftali']
5

reduce() Metodu
Κώδικας [Επιλογή]
reduce() metodu, dizi elemanlarını tek bir değere indirgemek için kullanılır:
Κώδικας [Επιλογή]
1let toplam = [1, 2, 3, 4].reduce(function(acc, num) {
2    return acc + num;
3}, 0);
4console.log(toplam); // Çıktı: 10
5

Dizi Metotları ile Örnekler
Dizi metotlarını gerçek hayatta nasıl kullanabileceğinizi göstermek için birkaç küçük örneğe bakalım.

  • Kullanıcı Listesi: Kullanıcıları bir dizide saklayıp, filter() metodu ile belirli bir kriterle filtreleme yapabilirsiniz.
  • Alışveriş Listesi: Alışveriş listesine eleman ekleyip, pop() metodu ile son ürünü çıkarabilirsiniz.
  • Dizi Manipülasyonu: Belirli değerleri değiştirmek için splice() ve slice() kullanabilirsiniz.

Sonuç
JavaScript dizileri, programlamanın birçok alanında son derece kullanışlıdır. Farklı metotlarla bu dizileri kolayca manipüle edebilir, sorunları daha hızlı çözebilirsiniz. Öğrenmeye devam ederek, daha karmaşık dizilerle de nasıl başa çıkacağınızı keşfedebilirsiniz. JavaScript dünyasında dizilerle oynamak oldukça eğlenceli!

Sıkça Sorulan Sorular (SSS)
  • JavaScript dizileri nasıl tanımlanır? let dizi = [eleman1, eleman2, ...]; şeklinde tanımlanabilir.
  • Dizinin sonuna nasıl eleman eklenir? push() metodu ile dizinin sonuna eleman ekleyebilirsiniz.
  • Diziyi nasıl filtrelerim? filter() metodu ile belirli bir koşula uyan elemanları yeni bir diziye atabilirsiniz.
  • Dizi elemanlarını döngü ile nasıl gezebilirim? forEach() metodu ile dizinin her elemanına erişebilirsiniz.
  • reduce() metodu ne işe yarar? Bir dizi içindeki değerleri tek bir değere indirgemek için kullanılır.

Εκτύπωση
Πάνω Σελίδες1
Ενέργειες χρήστη