JavaScript Dizi (Array) Yöntemleri
Güçlü bir programlama dili olan JavaScript birçok veri türlerini işlemesi gerekmektedir. Kullanılan bu yöntemler sayesinde daha net ve okunabilir kod yazılmasına yardımcı olmaktadır. Bu yazımda ise en çok kullanılan JavaScript yöntemlerini anlatacağım.
1. map( )
En kullanışlı ve sıklıkla kullanılan yöntemlerden biridir. Dizinin her öğesi için işlevi çağırır ve yeni bir sonuç dizisini oluşturur.
const exampleArray = [1, 2, 3, 4];
const result = exampleArray.map(element => element * 2);
console.log(result);// beklenen çıktı: [1, 4, 6, 8]
2. forEach( )
Bu yöntem ile birlikte dizideki her öğesi için bir işlev yürüterek dizi üzerinde döngü oluşturmasına yardımcı olur.
const exampleArray = ['elma','armut','mandalina','portakal'];
exampleArray.forEach(element => console.log(element));// beklenen çıktı: "elma",
// beklenen çıktı: "armut",
// beklenen çıktı: "mandalina",
// beklenen çıktı: "portakal",
3. sort()
Dizi öğelerini artan düzeyde sıralayarak sıralanmış diziyi tekrar döndürür.
const exampleArray = [1, 4, 3, 32, 25];
exampleArray.sort();
console.log(exampleArray);// beklenen çıktı: [1, 25, 3, 32, 4]
Görüldüğü üzere garip bir durum söz konusu. Bizim beklediğimiz çıktı mantıken şu şekilde olması gerekiyor:
[1, 25, 3, 32, 4]
Peki neden böyle bir dizi ile karşılaştık? Bunun sebebi, tüm öğeler karşılaştırmalar için dizelere yani string değerlere dönüştürülür ve dizeler için sözlük sıralaması uygulanır ve biz bu yüzden 3 > 32 olduğunu görüyoruz. Bu durumu çok basit bir şekilde iyileştirirsek eğer:
// Küçükten büyüğe göre sıralamak için
const exampleArray = [1, 4, 3, 32, 25];
exampleArray.sort(function(a, b) { return a — b;});
console.log(exampleArray);// beklenen çıktı: [1, 3, 4, 25, 32]// Büyükten büyüğe göre sıralamak içinconst exampleArray = [1, 4, 3, 32, 25];
exampleArray.sort(function(a, b) { return b — a;});
console.log(exampleArray);// beklenen çıktı: [32, 25, 4, 3, 1]
4. filter()
Bu yöntem aslında adında anlaşılacağı üzere filtreleme yaparak yalnızca sağlanan işlevin içindeki koşulu ileten öğelerle yeni bir dizi oluşturur.
const exampleArray = [4,21,6,12,7,43];
const result = exampleArray.filter(element => element < 10);
console.log(result);// beklenen çıktı: [4,6,7]
5. every()
Dizideki belirtilen şartı geçen her öğeyi kontrol ederek uygun şekilde true veya false döndüren bir yöntemdir.
const exampleArray = [4,21,6,12,7,43];
const result1 = exampleArray.every(element => element < 6);
console.log(result1);// beklenen çıktı: falseconst result2 = exampleArray.every(element => element < 44);
console.log(result2)// beklenen çıktı: true
6. concat()
Mevcut dizileri değiştirmeden iki veya daha fazla diziyi birleştirerek yeni bir dizi oluşturan bir yöntemdir.
const exampleArray1 = [1,2,3];
const exampleArray2 = [“elma”,”armut”];
const result = exampleArray1.concat(exampleArray2);
console.log(result)// beklenen çıktı: [1, 2, 3, "elma", "armut"]
7. reduce()
Oldukça kullanışlı ve sıklıkla kullanılan yöntemlerden biridir. Bir hayli karışık olan bu yöntemi çok detaylı açıklayarak kafanızı karışmak istemediğim için basit bir şekilde anlatmaya çalışacağım.
Biz bu yöntemi kullanarak aslında şunu demiş oluyoruz: “Dizimi tek bir değere indirgemek istiyorum”.
const arr = [1,2,3,4,5];
const result = arr.reduce((total,current) => total + current);
console.log(result)//beklenen çıktı: 15
Bu yöntem genellikle matematiksel işlemleri yapmak için kullanılır.
8. join()
Bir dizideki tüm öğeleri belirtilen bir ayırıcıyla ayıran, birleştiren ve bunun sonucunda yeni bir dize döndürür.
const elements = ['k','i','v','i'];
console.log(elements.join(‘’));// beklenen çıktı: “kivi”
9. includes()
Bir dizinin belirli bir değeri içerip içermediğini kontrol ederek uygun şekilde true veya false döndüren bir yöntemdir.
const exampleArray = [1,2,3,4,5];
const result1 = exampleArray.includes(8);
console.log(result1);// beklenen çıktı: falseconst result2 = exampleArray.includes(2);
console.log(result2)// beklenen çıktı: true
10. some()
Bu yöntem ile birlikte bir dizinin en az belirli bir değeri içerip içermediğini kontrol ederek uygun şekilde true veya false döndürür.
const exampleArray = [1,2,3,4,5];
console.log(exampleArray.some(element => element < 3));// beklenen çıktı: trueconsole.log(exampleArray.some(element => element > 6));// beklenen çıktı: false
11. shift()
Dizideki ilk elemanı silerek o elemanı döndürür.
const exampleArray = [‘Erşan Kuneri’,’Arif Işık’,’Tolgshow’];
const result = exampleArray.shift();
console.log(result);// beklenen çıktı: Erşan Kunericonsole.log(exampleArray);// beklenen çıktı: ["Arif Işık", "Tolgshow"]
12. unshift()
Bu yöntem ise bir dizinin başına olmak üzere bir veya daha fazla eleman ekler ve oluşan dizinin yeni uzunluğunu döndüren bir yöntemdir.
const exampleArray = [‘Erşan Kuneri’,’Arif Işık’,’Tolgshow’];
const result = exampleArray.unshift(‘CMYLMZ’);
console.log(result);// beklenen çıktı: 4console.log(exampleArray);// beklenen çıktı: ["CMYLMZ", "Erşan Kuneri", "Arif Işık", "Tolgshow"]
13. pop()
Dizinin sonundaki son elemanı kaldırır ve o öğeyi döndürür.
const exampleArray = [‘Erşan Kuneri’,’Arif Işık’,’Tolgshow’];
const result = exampleArray.pop();
console.log(exampleArray);// beklenen çıktı: ["Erşan Kuneri", "Arif Işık"]
14. push()
Dizinin sonuna bir veya daha fazla eleman ekleyerek dizinin yeni uzunluğunu döndürür.
const exampleArray = [“Kivi”,2,3];
const result = exampleArray.push(‘Mandalina’);
console.log(exampleArray);// beklenen çıktı: ["Kivi", 2, 3, "Mandalina"]
15. reverse()
Bu yöntem ile birlikte, bir diziyi tersine çevirerek bize geri döndürür.
const exampleArray = [“Kivi”,2,3,”Medium”];
const result = exampleArray.reverse()console.log(result);
// beklenen çıktı: ["Medium", 3, 2, "Kivi"]
16. slice()
Başlangıç ve bitiş değer alarak belirtilen aralıklardaki eleman veya elemanları yeni bir dize oluşturarak geri döner.
const exampleArray = [“Kivi”,2,3,”Medium”];
const result = exampleArray.slice(1,3)
console.log(result);// beklenen çıktı: [2, 3]
17. fill()
Boş bir dizi varsa statik bir değer ile diziyi doldurur fakat dolu bir dizi varsa elemanları belirlenen statik bir değer ile değiştiren bir yöntemdir.
const newArray = new Array(4);
const exampleArray = [“Kivi”,2,3,”Medium”];console.log(newArray.fill(10));
// beklenen çıktı: [10,10,10,10]console.log(exampleArray.fill(10));
// beklenen çıktı: [10,10,10,10]
18. indexOf()
Bu yöntem dizide belirtilen elemanın dizide kaçıncı sırada olduğunu yani bize index sayısını söyler eğer dizide öyle bir eleman mevcut değilse -1 değerini döner.
const exampleArray = [“Kivi”,2,3,”Medium”];
console.log(exampleArray.indexOf(“index”));
// beklenen çıktı: -1console.log(exampleArray.indexOf(“Medium”));
// beklenen çıktı: 3
19. find()
Dizideki belirtilen şartı geçen ilk elemanı bularak geri döndürür.
const exampleArray = [1,2,3,4,5,6];
console.log(exampleArray.find(element=> element > 2));// beklenen çıktı: 3
20. findIndex()
find() ve indexOf() yöntemlerinin karışımına benzeyen bu yöntemde dizideki belirtilen ilk şartı geçen ilk elemanın index sayısını bize geri döndüren bir yöntemdir.
const exampleArray = [4,2,7,1,8];
console.log(exampleArray.findIndex(element=> element > 5));// beklenen çıktı: 2
Sonuçlar
JavaScript’te en çok kullanılan yöntemleri sizlere kısaca anlatmaya çalıştım. Umarım aradığınızı ve istediğinizi bulduğunuz faydalı bir yazı olmuştur. Okuduğunuz için teşekkür ederim.