Tüm blog yazıları

JavaScript’te Higher Order Functions Nedir?

JavaScript öğrenmeye başlayan herkes fonksiyonların nasıl çalıştığını öğrendiğinde büyük bir kapıyı aralamış olur. Fonksiyonlar sadece görev yapan kod parçaları değildir; aynı zamanda girdi (parametre) ve çıktı (döndürülen d

eminbasbayan4 dk okuma
JavaScript’te Higher Order Functions Nedir?

JavaScript öğrenmeye başlayan herkes fonksiyonların nasıl çalıştığını öğrendiğinde büyük bir kapıyı aralamış olur. Fonksiyonlar sadece görev yapan kod parçaları değildir; aynı zamanda girdi (parametre) ve çıktı (döndürülen değer) olarak da kullanılabilir. Bu da bize yazılım dünyasında çok güçlü bir esneklik sağlar.

Bu yazıda fonksiyonların iki önemli özelliğini ele alacağız:

  1. Fonksiyonların başka bir fonksiyona parametre olarak verilmesi
  2. Fonksiyonların başka bir fonksiyon döndürmesi

Her iki özellik de higher order functions (üst düzey fonksiyonlar) başlığı altında incelenir. Hadi şimdi sırasıyla örneklerle inceleyelim.

Fonksiyonlar da Birer Değerdir

JavaScript’te fonksiyonlar da tıpkı sayılar, metinler veya diziler gibi birer değerdir. Yani:

  • Değişkenlere atanabilir,
  • Parametre olarak başka fonksiyonlara gönderilebilir,
  • Fonksiyonlardan döndürülebilir.
jsx
const sayHello = function() {
  console.log("Merhaba!");
};

sayHello(); // "Merhaba!"

Burada sayHello değişkeninin içine bir fonksiyon koyduk. Artık bu değişkeni normal bir değer gibi kullanabiliriz.

1. Fonksiyonları Parametre Olarak Vermek

Bir fonksiyonun, parametre olarak başka bir fonksiyonu alması çok yaygın bir yapıdır.

Örnek: Fonksiyonu İki Kez Çalıştıran Yapı

jsx
function executeTwice(task) {
  task();
  task();
}

function displayMessage() {
  console.log("Bu bir mesajdır.");
}

executeTwice(displayMessage);

Çalıştırıldığında konsolda şunu görürüz:

metin
Bu bir mesajdır.
Bu bir mesajdır.

Burada dikkat edilmesi gereken nokta:

  • executeTwice(displayMessage) doğru kullanımdır (fonksiyonun kendisini gönderiyoruz).
  • executeTwice(displayMessage()) yanlış olur (fonksiyonu hemen çalıştırır ve sonucunu gönderir).

Örnek: 5 Kez Çalıştıran Fonksiyon

jsx
function repeatFiveTimes(action) {
  for (let i = 0; i < 5; i++) {
    action();
  }
}

function printRandomNumber() {
  const number = Math.floor(Math.random() * 100) + 1;
  console.log("Rastgele sayı:", number);
}

repeatFiveTimes(printRandomNumber);

Bu kod çalıştırıldığında her seferinde 1 ile 100 arasında farklı 5 sayı yazdırır.

Böylece bir fonksiyonun parametre olarak alınmasının pratik faydasını görmüş olduk.

2. Fonksiyon Döndürmek: Fonksiyonların Fonksiyon Üretmesi

Fonksiyonlar sadece parametre almakla kalmaz; aynı zamanda yeni bir fonksiyon üretebilir ve döndürebilir.

Basit Örnek

jsx
function sesUretici() {
  return function() {
    console.log("Yeni ses: Bip bip!");
  };
}

const ses = sesUretici();
ses(); // "Yeni ses: Bip bip!"

Burada sesUretici, çağrıldığında bize bir fonksiyon döndürür. Biz de o fonksiyonu değişkene atayıp sonradan çalıştırabiliriz.

Gerçek Hayat Benzetmesi: Otomat Makinesi

Bunu bir otomat makinesine benzetebiliriz:

  • Parayı atarsın (fonksiyonu çağırırsın).
  • Makine sana bir paket verir (yeni bir fonksiyon döner).
  • Paketi açtığında ne olduğunu görürsün (fonksiyonu çalıştırırsın).

Örnek: Rastgele Mesaj Gönderen Fonksiyon

jsx
function mesajUretici() {
  const rastgeleSayi = Math.random();
  if (rastgeleSayi > 0.5) {
    return function() {
      console.log("Harika! Bugün şanslı günündesin.");
    };
  } else {
    return function() {
      console.log("Maalesef... Bugün pek iyi gitmiyor.");
    };
  }
}

const mesaj = mesajUretici();
mesaj();

Her çalıştırıldığında farklı bir fonksiyon döner ve konsola farklı mesaj yazdırabilir.

Örnek: Factory Function (Kontrol Fonksiyonları Üretmek)

jsx
function aralikKontrolFonksiyonu(min, max) {
  return function(sayi) {
    return sayi >= min && sayi <= max;
  };
}

const gencMi = aralikKontrolFonksiyonu(13, 25);
const yetiskinMi = aralikKontrolFonksiyonu(26, 64);
const yasliMi = aralikKontrolFonksiyonu(65, 120);

console.log(gencMi(20));   // true
console.log(yetiskinMi(50)); // true
console.log(yasliMi(30));   // false

Burada tek bir üretici fonksiyon yazarak farklı aralıklar için kontrol fonksiyonları elde ettik. Kodumuzu tekrar tekrar yazmamıza gerek kalmadı.

Higher Order Functions Neden Önemlidir?

Hem parametre olarak fonksiyon almak hem de fonksiyon döndürmek:

  • Kodumuzu daha esnek hale getirir,
  • Tekrar kullanılabilirliği artırır,
  • Daha modüler bir yapı kurmamıza yardımcı olur.

JavaScript’in yerleşik fonksiyonlarının çoğu zaten higher order function’dır:

  • forEach, map, filter → Fonksiyonları parametre olarak alır.
  • setTimeout → Fonksiyon parametre olarak alır.
  • Factory function mantığı → Fonksiyon döndürür.

Sonuç

Bu yazıda higher order functions kavramının iki yönünü öğrendik:

  1. Fonksiyonları parametre olarak vermek
  2. Fonksiyonlardan fonksiyon döndürmek

Bu yapıların gücünü kavradıkça JavaScript kodunun ne kadar esnek ve güçlü olabileceğini fark edeceksiniz. Modern JavaScript ve özellikle framework’lerde (React, Node.js vb.) bu mantık sıkça karşımıza çıkar.

JavaScript Classes ile pratik uygulamalar, metotlar arası iletişim ve gerçek dünya kod örnekleri
JavaScript Dersleri9 dk okuma

JavaScript Classes - Pratik Uygulamalar

JavaScript class'ları ile pratik uygulamalara geçin! Metotlar arası iletişimden constructor'da metot çağırmaya, kod tekrarını azaltmaktan gerçek dünya senaryolarına kadar class kullanımının inceliklerini keşfedin. Kendi alışveriş sepeti örneğinizle bilginizi pekiştirin.

Yazıyı oku
JavaScript class yapısını gösteren bir kod örneği, ES6 ile modern nesne oluşturma
JavaScript Dersleri9 dk okuma

JavaScript Classes

ES6 ile JavaScript'e gelen class yapısı sayesinde nesne oluşturmak artık çok daha kolay ve düzenli! Constructor function karmaşasından kurtulup, okunabilir ve yönetilebilir kodlar yazmak isteyenler için modern JavaScript'in temel taşı olan class'ları tüm detaylarıyla keşfedin. Bu rehberle nesne şabl

Yazıyı oku
JavaScript kodunda Constructor Function ve new keyword'ü ile nesne oluşturma örnekleri
JavaScript Dersleri8 dk okuma

Constructor Functions ve new Keyword

Factory Function'ların hafıza israfı sorununa Constructor Function'lar ve new keyword'ü ile son verin! Metotları paylaştırarak JavaScript objelerini daha verimli nasıl oluşturacağınızı, new'in perde arkasında neler yaptığını ve prototype sisteminin gücünü bu rehberde keşfedin.

Yazıyı oku

Çerez tercihlerin

Platformun çalışması için zorunlu çerezler kullanıyoruz. İzin verirsen anonim kullanım verilerini ölçüyoruz. Ayrıntıları incele