“Callback” fonksiyonlar Javascript’te oldukça önemliler ve neredeyse her yerde karşınıza çıkıyorlar. Eğer Javascript’e C gibi daha geleneksel dillerden geldiyseniz ilk başta biraz sinir bozucu gelebilirler. Ama bu fonksiyonları tam olarak anladığınız zaman işleri Javascript yoluyla yapmaya başladığınızda diğer yol aklınıza bile gelmeyecek.


Örneğin şöyle bir işlem sırası düşünün (Crockford’un kitabından). İlk önce kullanıcı etkileşimi ile başlıyor. Daha sonra sunucudan bir istekte bulunuyor ve son olarak da sunucudan gelen cevabı gösteriyor.


PHP- Kodu:
istek = istegi_hazirla();
cevap = istegi_sunucuya_gonder(istek);
goster(cevap); 
Bu yaklaşımdaki ana problem isteğin sunucuya senkronize (synchronous) şekilde gönderilmesinde ve cevap gelene kadar istemciyi dondurmasında yatmakta. Dolayısı ile eğer ağın o andaki durumundan, sunucunun yavaşlığından veya başka bir sebepten dolayı kaynaklanan bütün geçikmelerde istemci donacak ve uygumalanız aksayacaktır.


Daha doğru bir yöntem ise asenkron (asynchronous) bir istek gödermekte. Böylece istek fonksyionu asenkron olarak gönderilecek, hemen tamamlanacak, sunucudan cevap gelince sonuç gösterilecek.


PHP- Kodu:
istek = istegi_hazirla();
istegi_gonder(istek, function (cevap) {
        display(cevap);
}); 

Wikipedia callback fonsksiyonları şöyle açıklıyor.
“A reference to executable code, or a piece of executable code, that is passed as an argument to other code.”
Yani
“Başka bir koda argüman olarak verilen, çalışabilir kod veya kod parçası.”
Javascript ile tanıştıysanız ve jQuery kullanıyorsanız bilseniz de bilmeseniz de büyük ihtimalle “callback” fonksiyonları zaten kullanıyorsunuz demektir.


PHP- Kodu:
$("p").show('slow', function () {
  // callback fonksiyon
}); 
Yukarıdaki kod parçası jQuery’nin show metodunu çağırıyor, argüman olarak ise ilk olarak animasyonun hızını belirleyen bir argüman sonra da bir callback fonksiyon kabul ediyor.
“show” metodu sona erdiği zaman bu fonsksiyon çalıştırılıyor.


Kendi Callback Fonksiyonunu Yazmak


PHP- Kodu:
function dondurma(param1, param2, callback) {
    alert('Dondurma yemeye başladım.\n\nİçinde: ' + param1 + ', ' + param2 + ' var.');
    callback();
}

dondurma('çilek', 'çikolata', function() {
    alert('Ohh. Dondurma çok iyi geldi!');
}); 
Bu örneği geliştirebiliriz.

Mesela aşağıdaki kod bloğu callback fonksiyonu opsiyonel yapmak için kullanılabilir:


PHP- Kodu:
if (callback) {  
    callback();  
} 
Burada göz önünde bulundurulması gereken bir nokta var. O da zamanlama. Mesela bir callback’i fonksiyon içinde en sonda çağırdığınızda en çalışacak olsa da bazı durumlarda sonuçlar beklendiği gibi olmayabilir. Örneğin callback’i çağıran fonskyion bir çeşit asenkron kod içeriyorsa, callback bundan sonra çalışacaktır ama büyük ihtimalle daha önceki asenkron kodun cevabı gelmeden de sonlanacaktır. Dolayısı ile her ne kadar en son çağırılmış ve çalışmış olsa da sonuç beklendiğinden önce gelebilir.


PHP- Kodu:
function dondurma(param1, param2, callback) {
    alert('Dondurma yemeye başladım.\n\nİçinde: ' + param1 + ', ' + param2 + ' var.');
    setTimeout(function(){alert("Merhaba")},3000);
    callback();
}

dondurma('çilek', 'çikolata', function() {
    alert('Ohh. Dondurma çok iyi geldi!');
}); 
Yukarıdaki kodda Merhaba yazısı callback’ten sonra gösterilecek.


JSbin’de incele


Callback fonksiyonlar kullanan asenkron uygulamalar kullanıcı etkileşimli uygulamalar yazmak için en iyi yöntemlerden biri.