JavaScript Fonksiyonları ile Dizi İşlemleri: Örneklerle Anlatım

JavaScript Fonksiyonları ile Dizi İşlemleri: Örneklerle Anlatım

JavaScript Fonksiyonları ile Dizi İşlemleri: Örneklerle Anlatım kitabı, JavaScript'te dizileri kullanarak veri işleme süreçleriyle ilgili teknikleri öğrenmek isteyenler için yazılmıştır Bu kitap sayesinde, JavaScript'te kullanabileceğiniz birçok dizi fonksiyonu ve metodu hakkında detaylı bilgi edineceksiniz Ayrıca kitapta yer alan örnekler sayesinde, dizi işlemlerini pratiğe dönüştürerek öğreneceksiniz Dizi işlemleri konusunda uzmanlaşmak isteyenler için mutlaka okunması gereken bir kaynak!

JavaScript Fonksiyonları ile Dizi İşlemleri: Örneklerle Anlatım

Bu makalede JavaScript fonksiyonları kullanılarak yapılabilecek dizi işlemleri, örneklerle anlatılacak. Diziler, programlama dillerindeki temel veri yapılarından biridir ve birden fazla değeri aynı değişkende saklamamızı sağlar. Diziler üzerinde yapılacak işlemler, programlama dillerinde sıkça kullanılan işlemler arasındadır. Bu nedenle JavaScript fonksiyonları ile yapılan dizi işlemlerine ayrıntılı bir şekilde değinmek faydalı olacaktır.

Makalemizde dizilerin tanımlanması, eleman ekleme/çıkarma işlemleri, sıralama ve filtreleme işlemleri, dizi döngüleri gibi konulara odaklanacağız. Böylece JavaScript fonksiyonları kullanarak yapabileceğimiz birçok dizi işlemini örneklerle göreceğiz. Bu sayede hem JavaScript öğrenenlerin bilgisini artırmak hem de tecrübeli programcıların farklı yaklaşımlarını gözden geçirmelerini sağlamak amaçlanmaktadır.

  • Dizilerin tanımlanması ve özellikleri
  • Dizi elemanlarının okunması ve değiştirilmesi
  • Dizi elemanlarının ekleme ve silinmesi
  • Dizilerde eleman sıralama işlemleri
  • Belirli koşullara göre elemanların filtrelendiği işlemler
  • Dizi döngüleri

Bu konularla ilgili örnekler vererek, JavaScript fonksiyonları ile dizi işlemleri konusunda daha geniş bir anlayış kazanmayı hedefliyoruz. Kendi projelerinizde de bu bilgileri uygulayabilir ve daha etkin programlar yazabilirsiniz. Üstelik bu işlemleri yapmak için sadece basit bir metin editörüne ihtiyacınız var, çok sayıda geliştirme aracına ihtiyaç duymadan bu işlemleri kolayca gerçekleştirebilirsiniz. Ayrıca, bu yazımda göreceğiniz bazı JavaScript fonksiyonları, programlama dillerindeki diğer fonksiyonların yapısını anlamanıza yardımcı olacaktır.


Dizilerin Tanımlanması ve Eleman Ekleme/Çıkarma İşlemleri

JavaScript dillerinde en önemli özelliklerden biri olan diziler, birden fazla değeri tek bir değişkende depolamamıza olanak sağlar. Dizilerin tanımlanması ve eleman ekleme/çıkarma işlemleri oldukça basittir.

Bir dizi oluşturmak için "[ ]" işaretleri kullanılır. Örneğin, "let numbers = [1, 2, 3, 4, 5]" şeklinde bir dizi oluşturulabilir. Dizi oluşturulduktan sonra, eleman eklemek veya çıkarmak için çeşitli işlemler yapılabilir.

Eleman ekleme işlemi için "push()" fonksiyonu kullanılabilir. Örneğin, numbers dizisine 6. eleman olarak "numbers.push(6)" işlemi yapılabilir. Eleman çıkarma işlemi için ise "pop()" fonksiyonu kullanılır. Örneğin, numbers dizisinden son eleman "numbers.pop()" işlemi ile çıkarılabilir.

Bir başka eleman çıkarma işlemi için "splice()" fonksiyonu kullanılabilir. Bu fonksiyon sayesinde, istenilen eleman veya elemanlar çıkarılabilir. Örneğin, numbers dizisinden 2. ve 3. elemanlar "numbers.splice(1, 2)" işlemi ile çıkarılabilir.

Dizi işlemleri oldukça basit ve kolaydır. Diziler, birden fazla değerleri depolama konusunda oldukça kullanışlıdır ve işlemler de kolayca yapılabilmektedir.


Sıralama ve Filtreleme İşlemleri

Dizilerdeki elemanları sıralamak ve belirli koşullara göre filtrelemek oldukça yaygın bir ihtiyaçtır. JavaScript'te, sıralama işlemleri için sort() ve reverse() fonksiyonları kullanılır. Bu fonksiyonların kullanımı oldukça kolay ve özelleştirilebilir.

Örneğin, aşağıdaki dizi elemanlarını sıralamak için sort() fonksiyonunu kullanabiliriz:

let sayilar = [5, 3, 8, 2, 9];sayilar.sort();

Bu kod bloğu, "2, 3, 5, 8, 9" şeklinde sıralanmış bir dizi elde etmemizi sağlar. Ayrıca elemanları tersine sıralamak için reverse() fonksiyonunu da kullanabiliriz:

let isimler = ["Ali", "Ayşe", "Burak", "Can"];isimler.reverse();

Bu kod, "Can, Burak, Ayşe, Ali" şeklinde bir dizi oluşturur.

Filtreleme işlemleri için ise filter() ve find() fonksiyonları mevcuttur. Bu fonksiyonlar, belirli bir koşula uygun olan elemanları filtrelememize olanak tanır. Örneğin, aşağıdaki kod bloğu, "sayilar" dizisindeki çift sayıları filtreler:

let sayilar = [1, 2, 3, 4, 5, 6];let ciftSayilar = sayilar.filter(function(sayi){   return sayi % 2 == 0;});

Bu kod, "2, 4, 6" şeklinde bir dizi oluşturur. Benzer şekilde find() fonksiyonu da benzer bir işlev görür, ancak yalnızca belirtilen koşulu sağlayan ilk elemanı döndürür.

Bu örnekler, sıralama ve filtreleme işlemlerinin nasıl gerçekleştirilebileceğini göstermektedir. Ancak, fonksiyonların daha da özelleştirilmesi ve farklı koşullara göre uyarlanması mümkündür. Dizi işlemleri oldukça çeşitlidir ve her koşula uygun farklı yöntemler kullanılabilir.


Elemanları Sıralama Fonksiyonları

JavaScript'te yaygın olarak kullanılan dizi işlemlerinden biri de elemanları sıralama işlemleridir. Dizideki elemanları belirli bir sıraya göre sıralamak veya tersine çevirmek için kullanabileceğimiz sort() ve reverse() fonksiyonlarını inceleyelim.

sort() fonksiyonu, alfabetik olarak veya sayısal olarak sıralama yapar. Örneğin, aşağıdaki dizi içerisindeki sayılar küçükten büyüğe doğru sıralanacak şekilde sort() fonksiyonu kullanılabilir:

var numbers = [5, 2, 8, 1, 10];
numbers.sort(function(a, b){return a-b});
  • İlk olarak, bir sayılar dizisi tanımlanır.
  • Ardından, sort() fonksiyonu kullanılarak elemanlar küçükten büyüğe doğru sıralanır.
  • sort() fonksiyonu içerisinde kullanılan function(a, b){return a-b} kodu, elemanların sıralanmasını sağlar. Bu kod, elemanların sayısal değerlerine göre sıralama yapar.

Tersine sıralama işlemi ise reverse() fonksiyonu ile yapılabilir. Örneğin, yukarıdaki sayılar dizisi tersine çevrilebilir:

var numbers = [5, 2, 8, 1, 10];
numbers.reverse();
  • Dizi elemanları sort() fonksiyonu ile sıralandıktan sonra, reverse() fonksiyonu kullanılarak tersine çevrilebilir.
  • reverse() fonksiyonu, diyelim ki bir dizi alfabetik olarak sıralanmış olsun, bu fonksiyonu kullanarak tersine çeviririz ve bu sayede diziyi ters şekilde de görebiliriz.

sort() ve reverse() fonksiyonları, birden fazla anahtar değere sahip nesnelerin veya objelerin sıralanması için de kullanılabilir. Bu durumda, sort() fonksiyonu içerisinde aşağıdaki gibi bir kod parçası kullanılabilir:

var people = [ { name: "John", age: 30 }, { name: "Alice", age: 25 }, { name: "Bob", age: 40 } ];
people.sort(function(a, b){return a.age - b.age});
  • Bu örnekte, people dizisi içerisindeki nesneler, age değerlerine göre sıralanıyor.
  • age değeri küçük olan nesneler önce, büyük olan nesneler sonra yer alacak şekilde sıralama yapılır.

Elemanları sıralama işlemleri, JavaScript fonksiyonları sayesinde kolayca yapılabilir. Bu sayede, dizi içerisindeki elemanlar istenilen şekilde sıralanıp kullanılabilir.


Anahtar Değerlerine Göre Sıralama İşlemi

Dizilerdeki elemanların anahtar değerlerine göre sıralama işlemi, özellikle nesne tipi verileri sıralarken oldukça önemlidir. Anahtar değerine göre sıralama işlemi yapmak için kullanılan yöntem sort() fonksiyonudur. Bu fonksiyon, dizideki elemanları alfabetik olarak sıralar. Ancak, sayısal bir sıralama işlemi yapmak isterseniz, biraz farklı bir yöntem kullanmanız gerekebilir. İşte bir örnek kod:

Dizi Sıralama İşlemi
[ { ad: "Ahmet", yaş: 22 }, { ad: "Mehmet", yaş: 30 }, { ad: "Ali", yaş: 25 } ] sort(function(a, b){return a.yaş - b.yaş})
[ { ad: "Ayşe", sınav: 70 }, { ad: "Fatma", sınav: 90 }, { ad: "Zeynep", sınav: 80 } ] sort(function(a, b){return b.sınav - a.sınav})
  • Bu örnekte, birinci dizi yaş değerlerine göre, ikinci dizi ise sınav değerlerine göre sıralanmıştır.
  • sort() fonksiyonu, dizinin orijinal yapısını değiştirir, yani dizideki elemanların sıralandığı bir şekilde kalıcı olarak yerleşir.
  • Dizinin orijinal sırasını korumak isterseniz, önce kopyasını almanız gerekir.

Bunun yanı sıra, dizideki elemanların anahtar değerlerine göre ters sıralama işlemi yapmak isterseniz reverse() fonksiyonunu kullanabilirsiniz. İşte bir örnek kod:

var dizi = [ { ad: "Ahmet", yaş: 22 }, { ad: "Mehmet", yaş: 30 }, { ad: "Ali", yaş: 25 } ];dizi.sort(function(a, b){return a.yaş - b.yaş});dizi.reverse();

Bu örnekte, önce yaş değerlerine göre sıralama işlemi yapılır ve sonra dizideki elemanların ters sıralanması sağlanır. Unutmayın ki reverse() fonksiyonu da, dizinin orijinal yapısını değiştirir.


Eleman Değerlerine Göre Sıralama İşlemi

Dizilerdeki elemanların değerlerine göre sıralamanın yapılması amacıyla sort() metodu kullanılabilmektedir. Sıralama işleminin nasıl yapılabileceğine dair örnek kod blokları aşağıda verilmiştir:

DiziSıralanmış Dizi
[25, 5, 8, 20, 15, 3][3, 5, 8, 15, 20, 25]
['elma', 'armut', 'çilek', 'mandalina']['armut', 'elma', 'mandalina', 'çilek']

Bu yöntemle yapılabilecek sıralama işleminin başka bir kullanım örneği de nesne içeren diziler için kullanılan anahtar değerlerine göre sıralamadır. Örneğin, dizi içerisinde yer alan nesnelerin boyutlarına göre artan ya da azalan şekilde sıralama işlemi yapılabilir. Kod blokları aşağıdaki gibi olacaktır:

DiziSıralanmış Dizi
[{boy: 180, kilo: 80}, {boy: 170, kilo: 65}, {boy: 175, kilo: 75}][{boy: 170, kilo: 65}, {boy: 175, kilo: 75}, {boy: 180, kilo: 80}]
[{boy: 180, kilo: 80}, {boy: 170, kilo: 65}, {boy: 175, kilo: 75}][{boy: 180, kilo: 80}, {boy: 175, kilo: 75}, {boy: 170, kilo: 65}]

Dizilerin elemanlarına göre sıralama işleminin yanı sıra aynı zamanda filtreleme işlemi de yapılabilir. Bu şekilde, örneğin sadece belirli bir sayının üzerinde ya da altındaki elemanlar çıkarılabilir ya da kategorize edilebilir. Bu tür işlemlere find() metodu ile de erişim sağlanabilir. Aşağıda verilen kod blokları, eleman filtrelemeye dair örnekler içermektedir:

DiziFiltrelenmiş Dizi
[5, 9, 12, 25, 30, 35, 40][25, 30, 35, 40]
['elma', 'armut', 'çilek', 'mandalina']['çilek', 'mandalina']

Yukarıda yer alan örnek kod blokları, eleman sıralama ve filtreleme işlemleri hakkında fikir sahibi olmanıza yardımcı olacaktır.


Elemanları Filtreleme Fonksiyonları

JavaScript'de kullanılan dizi fonksiyonları sayesinde elemanları filtrelemek oldukça kolaydır. Bunun için kullanılan fonksiyonlar arasında en yaygın olanları Filter() ve Find() fonksiyonlarıdır.

Filter() fonksiyonu, belirli bir koşulu sağlayan dizideki tüm elemanları filtreler. Örneğin, bir dizi içerisinde yalnızca çift sayıları bulmak istiyorsak aşağıdaki kodu kullanabiliriz:

Kod Örneği: let sayilar = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];
let ciftSayilar = sayilar.filter(sayi => sayi % 2 == 0);

Yukarıdaki örnekte, sayilar adlı dizimizdeki tüm elemanları filtrelemek için filter() fonksiyonunu kullandık. İkinci satırda ise bu fonksiyonu kullanarak çift sayıları içeren yeni bir dizi oluşturduk.

Find() fonksiyonu ise, belirli bir koşulu sağlayan ilk elemanı filtreler. Örneğin, bir dizi içerisinde yalnızca 18 yaşından büyük kullanıcıları bulmak isteyebiliriz. Bunun için aşağıdaki kodu kullanabiliriz:

Kod Örneği: let kullanicilar = [
{ ad: 'Ahmet', yas: 25 },
{ ad: 'Ayşe', yas: 18 },
{ ad: 'Fatih', yas: 30 },
{ ad: 'Mehmet', yas: 17 }
]
let yetiskinKullanici = kullanicilar.find(kullanici => kullanici.yas > 18);

Yukarıdaki örnekte, kullanıcıların ad ve yaş bilgilerini içeren bir nesne dizisi tanımladık. İkinci satırda ise find() fonksiyonunu kullanarak bu dizideki ilk 18 yaşından büyük kullanıcıyı bulduk ve yetiskinKullanici adlı değişkene atadık.


Dizi Döngüleri

Diziler üzerinde işlem yaparken, farklı döngü türleri kullanarak daha etkili işlemler yapmak mümkündür. Örneğin, for, foreach ve map döngüleri sıklıkla kullanılan dizi döngü türlerindendir.

For Döngüsü: En sık kullanılan dizi döngü türüdür. Dizi elemanlarını belirli bir şart sağlanana kadar dizi boyunca gezinir ve her eleman için belirli bir işlem yapar. Şart sağlandığında döngü sona erer. Bu döngü türünün kullanımına örnek olarak, dizinin elemanlarını toplama işlemi verilebilir:

let toplam = 0;for (let i = 0; i < dizi.length; i++) {  toplam += dizi[i];}
Bu kod, dizinin bütün elemanlarını toplar ve toplam sonucunu döndürür.

Foreach Döngüsü: Dizi elemanları üzerinde gezinmek için kullanılan bir diğer döngüdür. For döngüsüne göre daha az yazılım kodu gerektirir. Her eleman için belirli bir işlem yapılmasına olanak sağlar. Kullanımına örnek olarak, dizideki elemanların ekrana yazdırılması verilebilir:

dizi.forEach(function(eleman) {  console.log(eleman);});
Bu kod, dizideki bütün elemanları ekrana yazdırır.

Map Döngüsü: Dizi elemanlarını değiştirerek yeni bir dizi oluşturmak için kullanılan bir döngüdür. Her eleman için belirli bir işlem yapar ve yeni bir dizi oluşturur. Kullanımına örnek olarak, dizideki her elemanın 2 katını alarak yeni bir dizi oluşturma işlemi verilebilir:

let yeniDizi = dizi.map(function(eleman) {  return eleman * 2;});
Bu kod, dizideki her elemanın 2 katını alarak yeni bir dizi oluşturur.

Bu döngü türleri, dizi işlemlerinde sıklıkla kullanılır ve işlemlerin daha etkili hale gelmesine yardımcı olur. Doğru bir şekilde kullanıldığında, dizi işlemleri daha hızlı ve verimli olabilir.


For Döngüsü

JavaScript'te dizi işlemleri yapmanın yollarından biri, for döngüsü kullanmaktır. For döngüsü, bir dizi içindeki elemanları işlemek için döngü içinde gezinmek için kullanılır. Döngü, belirtilen sayıda kez döner ve her dönüşünde, belirtilen işlemi gerçekleştirir.

Örneğin, bir sayı dizisi oluşturalım. Bu diziyi, for döngüsü kullanarak dolaşıp, elemanların toplamını bulalım.

let sayilar = [1, 2, 3, 4, 5];
let toplam = 0;
for (let i = 0; i < sayilar.length; i++) {
  toplam += sayilar[i];
}

Yukarıdaki kodda, ilk satırda bir dizi oluşturduk ve ikinci satırda bir toplam değişkeni tanımladık. Döngünün içinde, sayilar.length özelliği, dizinin eleman sayısını döndürür. Döngü, her bir eleman için bir kez döner ve toplam değişkenine her elemanın değeri eklenir. En sonunda, toplam değişkeni, elemanların toplamını içerir.

For döngüsü ile dizideki elemanlara erişmek, elemanlar arasında gezinmek, farklı işlemler uygulamak mümkündür. For döngüsü, dizi işlemlerinde en sık kullanılan döngü türüdür.


Foreach Döngüsü

Foreach döngüsü, bir dizi içindeki her bir eleman üzerinde döngü yapmak için kullanılır. Dizi içindeki her bir eleman işlem sırasında tek tek alınarak, belirtilen işlemin uygulanmasına olanak sağlar. Dizinin her bir elemanı için, belirtilen işlem adımı tekrarlanır. Foreach döngüsü daha önceki örneklerde de olduğu gibi, for döngüsüne oranla daha kısadır ve daha kolay anlaşılır. Foreach döngüsü, dizi içindeki her bir elemanı, belirtilen isimle ifade edilen kalıcı bir değişkene atar. Bu sayede, dizi içindeki elemanlardan herhangi birinin değiştirilmesi durumunda, değişken üzerinden eleman işleme alınmaya devam eder.

Örneğin, aşağıdaki kod bloğu, bir sayı dizisi üzerinde foreach döngüsü kullanarak dizideki tüm elemanların toplamını bulmaya olanak sağlar:

Kod Çıktı
        var sayilar = [2, 4, 6, 8, 10];        var toplam = 0;                sayilar.forEach(function(sayi) {          toplam += sayi;        });                console.log(toplam);      
30

Bu örnekte, toplam adında bir değişken oluşturuldu ve başlangıç değeri olarak 0 atandı. Dizi içindeki her bir sayı, foreach döngüsü kullanılarak toplam değişkenine eklenir. Döngü sonunda, toplam değişkeni ekrana yazdırılır ve dizideki tüm sayıların toplamı olan "30" değeri elde edilir.


Map Döngüsü

Map döngüsü, JavaScript'teki en kullanışlı dizi işleme fonksiyonlarından biridir. Bu döngü, bir diziyi dolaşır ve her elemanı belirli bir işleme tabi tutar. Bu işlem sonucunda yeni bir dizi oluşur ve bu dizi, her elemanın işlem sonucunu içerir.

Örneğin, bir dizi içindeki her elemanın karesini almak istediğimizi düşünelim. Bu işlemi for veya foreach döngüsü kullanarak yapmak oldukça zahmetli ve zaman alıcı olabilir. Ancak map döngüsü kullanarak bu işlemi kolaylıkla yapabiliriz.

Aşağıdaki örnek, bir sayı dizisindeki her elemanın karesini alarak yeni bir dizi oluşturur:

```const sayilar = [1, 2, 3, 4, 5];

const yeniSayilar = sayilar.map(function(sayi) { return sayi * sayi;});

console.log(yeniSayilar); // [1, 4, 9, 16, 25]```

Yukarıdaki örnekte, `map()` fonksiyonu sayesinde, `sayilar` dizisindeki her eleman üzerinde bir işlem gerçekleştirilir. İşlemin sonucunda, `yeniSayilar` isimli yeni bir dizi oluşur ve bu dizi, her elemanın karesini içerir. Döngü içinde kullanılan anonymous function ise, her elemanın kaç ile çarpılacağını belirler.

Map döngüsü, sadece bu örnekteki gibi basit matematiksel işlemler için değil, aynı zamanda dizideki nesnelerin belirli özelliklerine göre de işlemler yapmak için kullanılabilir. Örneğin, bir kullanıcı dizisindeki her kullanıcının isim özelliğini büyük harfe çevirmek için map fonksiyonunu kullanabilirsiniz.

```const kullanicilar = [ { isim: 'ali', yas: 26 }, { isim: 'ayşe', yas: 32 }, { isim: 'mehmet', yas: 22 }];

const buyukHarfIsimler = kullanicilar.map(function(kullanici) { return kullanici.isim.toUpperCase();});

console.log(buyukHarfIsimler); // ["ALI", "AYŞE", "MEHMET"]```

Yukarıdaki örnekte map fonksiyonu, `kullanicilar` dizisindeki her kullanıcının `isim` özelliğini büyük harfe çevirerek yeni bir dizi oluşturur. Bu sayede, yeni dizi içinde kullanıcı isimleri büyük harflerle yazılmış olarak saklanır.

Map döngüsü, hem dizi elemanları üzerinde işlem yapmak için hem de yeni bir dizi oluşturmak için oldukça kullanışlı bir fonksiyondur. Bu sayede, for veya foreach döngülerinde olduğu gibi zaman alıcı ve zahmetli işlemler yapmaktansa, tek bir fonksiyon kullanarak işlemleri kolaylıkla gerçekleştirebiliriz.