Javascript'te Gelişmiş Fonksiyonlar: Kurucu Fonksiyonlar, Yığın Fonksiyonlar ve Destructuring

Giriş

Hepinize merhaba! Bu yazıda, kurucu fonksiyonlar, yığın fonksiyonlar ve destructuring gibi özel fonksiyon türlerini inceleyeceğiz. Hazırsanız hemen şimdi başlayalım!

Kurucu Fonksiyonlar:

Kurucu fonksiyonlar, javascript'te nesneler oluşturmak için kullanılan özel fonksiyonlardır. Kurucu fonksiyonlar, new anahtar kelimesiyle çağırılır ve yeni bir nesne oluşturulur. Kurucu fonksiyonların kullanımı, nesneleri oluştururken daha pratik ve okunaklı hale getirir. Örneğin:

function Kisi(isim, yas) {
  this.isim = isim;
  this.yas = yas;
}

const tolga = new Kisi('Tolga', 20);
console.log(tolga.isim); // Tolga
console.log(tolga.yas); // 20

Yukarıdaki örnekte, Kisi adlı bir kurucu fonksiyon oluşturduk.
Bu fonksiyon, isim ve yas adında iki parametre alır.
Daha sonra, new Kisi('Tolga', 30) şeklinde çağırdığımızda, Tolga adlı yeni bir nesne oluşturulur ve nesnenin isim ve yas özelliklerine değerler atanır.

Yığın Fonksiyonlar:

Yığın fonksiyonlar, bir dizi fonksiyonu birbiri ardından çalıştırmak için kullanılan özel fonksiyonlardır.
Yığın fonksiyonlar, bir dizi fonksiyonun çıktısını bir sonraki fonksiyona girdi olarak verir. Örneğin:

const urunler = [
  { isim: 'Elma', fiyat: 3 },
  { isim: 'Armut', fiyat: 4 },
  { isim: 'Muz', fiyat: 5 }
];

const toplamFiyat = urunler.reduce((toplam, urun) => toplam + urun.fiyat, 0);
console.log(toplamFiyat); // 12

Yukarıdaki örnekte, urunler dizisindeki tüm ürünlerin fiyatlarını toplayan bir fonksiyon oluşturduk. Fonksiyon, reduce() yığın fonksiyonunu kullanarak ürünlerin fiyatlarını birbiriyle toplar ve sonucu toplamFiyat değişkenine atar.

Destructuring:

Destructuring, javascript'te nesneler ve dizilerin öğelerini ayrıştırmak için kullanılan özel bir yöntemdir.
Destructuring ile, nesneler ve dizilerdeki öğeleri tek tek değişkenlere atayabilir ve bu değişkenleri kullanarak daha kolay çalışabiliriz. Örneğin:

const kisi = { isim: 'Ali', yas: 30 };
const { isim, yas } = kisi;
console.log(isim); // Ali
console.log(yas); // 30

const urunler = ['Elma', 'Armut', 'Muz'];
const [ilki, ikincisi, ucuncusu] = urunler;
console.log(ilki); // Elma
console.log(ikincisi); // Armut
console.log(ucuncusu); // Muz

Yukarıdaki örneklerde, destructuring kullanarak kisi nesnesinin isim ve yas özelliklerini ayrıştırdık ve bu özellikleri ayrı değişkenlere atadık. Aynı şekilde, urunler dizisinin ilk, ikinci ve üçüncü öğelerini de ayrı değişkenlere atadık.

Özet

Kurucu fonksiyonlar, nesneleri oluştururken daha pratik ve okunaklı hale getirir. Yığın fonksiyonlar ise bir dizi fonksiyonu birbiri ardından çalıştırmak için çok yararlıdır. Destructuring ise, nesneler ve dizilerin öğelerini ayrıştırmak için kullanılır.

Okuduğunuz için teşekkürler!

Meraklısı için kaynakça

Working with objects - JavaScript | MDN

JavaScript is designed on a simple object-based paradigm. An object is a collection of properties, and a property is an association between a name (or key) and a value. A property’s value can be a function, in which case the property is known as a method.

MDN Web Docs.logo-m{fill:var(--text-link)}

Array.prototype.reduce() - JavaScript | MDN

The reduce() method executes a user-supplied “reducer” callback function on each element of the array, in order, passing in the return value from the calculation on the preceding element. The final result of running the reducer across all elements of the array is a single value.

MDN Web Docs.logo-m{fill:var(--text-link)}

Destructuring assignment - JavaScript | MDN

The destructuring assignment syntax is a JavaScript expression that makes it possible to unpack values from arrays, or properties from objects, into distinct variables.

MDN Web Docs.logo-m{fill:var(--text-link)}