JavaScript Dizileri için 13 İpucu

Yazının orijinaline ulaşmak için buraya tıklayabilirsiniz.

1. Tekrar Edenlerin Temizlenmesi

Popüler mülakat sorularından bir tanesi: “Dizinin içinden benzersiz değerleri nasıl ayıklarsınız?” Bunun için basit ve hızlı bir çözüm var;

var fruits = [“banana”, “apple”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”];


// İlk yöntem
var uniqueFruits = Array.from(new Set(fruits));

console.log(uniqueFruits);
// [“banana”, “apple”, “orange”, “watermelon”, “grape”]

// İkinci yöntem
var uniqueFruits2 = […new Set(fruits)];

console.log(uniqueFruits2); 
// [“banana”, “apple”, “orange”, “watermelon”, “grape”]

2. Belirli Bir Değerin Değiştirilmesi

Bazen, dizi içindeki belirli değerleri değiştirmek isteyebiliriz. Bunun için bir metodumuz var:splice(başlangıç, değiştirilecek değer sayısı, eklenecek değerler)

var fruits = [“banana”, “apple”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”];

fruits.splice(0, 2, “potato”, “tomato”);

console.log(fruits); 
// [“potato”, “tomato”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”]

3. map() Kullanmadan “map”

Array.from() metodunu da aynı amaçla kullanabilirsiniz;

var friends = [
    { name: ‘John’, age: 22 },
    { name: ‘Peter’, age: 23 },
    { name: ‘Mark’, age: 24 },
    { name: ‘Maria’, age: 22 },
    { name: ‘Monica’, age: 21 },
    { name: ‘Martha’, age: 19 },
]


var friendsNames = Array.from(friends, ({name}) => name);

console.log(friendsNames);
// [“John”, “Peter”, “Mark”, “Maria”, “Monica”, “Martha”]

4. Diziyi Boşaltmak

Bir diziyi temizlemek istiyorsunuz ama elemanları teker teker kaldırmak istemiyor musunuz? Bir diziyi boşaltmak için, dizinin uzunluğunu sıfır yapabilirsiniz;

var fruits = [“banana”, “apple”, “orange”, “watermelon”, “apple”, “orange”, “grape”, “apple”];


fruits.length = 0;

console.log(fruits); // []

5. Diziyi Objeye Dönüştürmek

Bazen bir diziyi, objeye dönüştürmek isteyebilirsiniz. Bunun için en hızlı yollardan birisi “spread operator (...)” kullanmak;

var fruits = [“banana”, “apple”, “orange”, “watermelon”];
var fruitsObj = { …fruits };

console.log(fruitsObj);
// {0: “banana”, 1: “apple”, 2: “orange”, 3: “watermelon”, 4: “apple”, 5: “orange”, 6: “grape”, 7: “apple”}

6. Diziyi Data İle Doldurmak

Datayla beraber bir dizi oluşturmak isterseniz, fill() metodu kolay ve temiz bir çözüm sunuyor;

var newArray = new Array(10).fill(“1”);

console.log(newArray);
// [“1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”, “1”]

7. Dizileri Birleştirme

concat() kullanmadan birçok diziyi tek bir diziye dönüştürmeyi biliyor musunuz? Tek satırlık kod ile birçok diziyi tek bir diziye çevirebiliriz. Çoktan fark ettiğiniz üzere, “spread operator” diziler ile çalışırken oldukça kullanışlı.

var fruits = [“apple”, “banana”, “orange”];
var meat = [“poultry”, “beef”, “fish”];
var vegetables = [“potato”, “tomato”, “cucumber”];
var food = […fruits, …meat, …vegetables];

console.log(food); 
// [“apple”, “banana”, “orange”, “poultry”, “beef”, “fish”, “potato”, “tomato”, “cucumber”]

8. İki Dizinin Kesişimini Bulma

Popüler mülakat sorularından bir tanesi daha. Kesişimleri bulmak için, önceki ipuçlarında kullandığımız birkaç metodu kullanacağız. Test ettiğimiz dizi içinde tekrar eden eleman olmadığından emin olmamız lazım, ve filter() ve includes() metodlarını kullanarak iki dizide de olan elemanları elde edeceğiz;

var numOne = [0, 2, 4, 6, 8, 8];
var numTwo = [1, 2, 3, 4, 5, 6];
var duplicatedValues = […new Set(numOne)].filter(item => numTwo.includes(item));

console.log(duplicatedValues);
// [2, 4, 6]

9. “Yanlış-sal” (falsy) Değerlerin Temizlenmesi

Önce “yanlış-sal”ın, “falsy”, ne olduğunu tanımlayalım: JavaScript için “falsy” değerler, 0, '', null, NaN, undefined. Şimdi bu değerlerden nasıl kurtulabileceğimizi görelim;

var mixedArr = [0, “blue”, “”, NaN, 9, true, undefined, “white”, false];
var trueArr = mixedArr.filter(Boolean);

console.log(trueArr);
// [“blue”, 9, true, “white”]

10. Dizi İçinden Rastgele Eleman Alma

Dizinin uzunluğuna bağlı olarak rastgele bir eleman almanın basit, hızlı, kısa ve temiz bir çözümü var;

var colors = [“blue”, “white”, “green”, “navy”, “pink”, “purple”, “orange”, “yellow”, “black”, “brown”];
var randomColor = colors[(Math.floor(Math.random() * (colors.length)))]

11. Diziyi Tersine Çevirmek

Bir diziyi tersine çevirmek için, karmaşık döngü ve fonksiyonlara ihtiyacınız yok. Bunun için hazır bir metot var;

var colors = [“blue”, “white”, “green”, “navy”, “pink”, “purple”, “orange”, “yellow”, “black”, “brown”];
var reversedColors = colors.reverse();

console.log(reversedColors);
// [“brown”, “black”, “yellow”, “orange”, “purple”, “pink”, “navy”, “green”, “white”, “blue”]

12. lastIndexOf()

JavaScript, istediğiniz elemanın bulunduğu son indeksi elde etmenizi sağlayacak bir metoda sahip. Örneğin, dizimiz tekrar eden verilere sahip ve elemanın dizideki son indeksini bulmak istiyoruz. Kod örneğine bakalım;

var nums = [1, 5, 2, 6, 3, 5, 2, 3, 6, 5, 2, 7];
var lastIndex = nums.lastIndexOf(5);

console.log(lastIndex); // 9

13. Dizideki Değerlerin Toplamı

JavaScript mülakatlarının başka bir sorusu daha… Korkacak bir şey yok çünkü reduce() metodu ile tek satırda çözülebilir;

var nums = [1, 5, 2, 6];
var sum = nums.reduce((x, y) => x + y);

console.log(sum); // 14