JavaScript fonksiyonları genel işlevi itibariyle diğer programlama dillerindeki fonksiyonlara benzerler. Ancak JavaScript fonksiyonları birer nesne olduğundan bir değerdirler ve bu yüzden farklı bir çok şekilde kullanılabilirler. Bu yazıda ve takip eden yazılarda JavaScript fonksiyonlarıyla ilgili genel konular ve farklı kullanım şekilleri anlatılmaktadır.
Fonksiyon Tanımlama
Kullanımı:
function fonksiyonAdi([parametre1, [parametre2, [...]]]) {
// işlemler
}
Basit bir JavaScript fonksiyonu şöyle tanımlanabilir:
function selam() {
alert("Selam");
}
Bir fonksiyonu çağırmak için adını yazdıktan sonra eğer parametresi yoksa parantez açıp kapatarak çağırırız.
Örneğin üstteki fonksiyonu şöyle çağırabiliriz.
Bir fonksiyon adının yanına parantezleri yazmadan kullanmak fonksiyonun gövdesini / kendisini döndürür.
Fonksiyonlar birer sınıf örneği (nesne) olduğundan bir değer olarak kullanılabilirler.
Örnek:
console.log(selam); // selam adının yanında () olmadığına dikkat edin.
(console.log fonksiyonu parantez içinde verilen değeri konsola yazdırır. Konsolu görmek için tarayıcı penceresinde F12 tuşuna basın. Altta, sağda veya ayrıca açılan penceredeki konsol / console sekmesini tıklayın.)
Çıktısı şöyle olacaktır:
function selam() {
alert("Selam");
}
(Bazı tarayıcılarda sadece selam() metni görebilirsiniz. Bu durumda console.log(selam) yerine alert(selam) yazmayı deneyin.)
Bu özellikten yararlanarak fonksiyonu bir değişkene atayıp ilgili fonksiyonu çağırabiliriz.
var a = selam;
// Alttaki ifade selam fonksiyonunu çağırır. "selam()" şeklinde çağırmakla aynıdır.
a();
Fonksiyona Parametre Gönderme
Fonksiyonlar 255 adede kadar parametre alabilirler. Fonksiyon parametreleri fonksiyon tanımında fonksiyon adından sonraki parantezlerin içinde birer isimle bildirilir ve birden çok parametre varsa aralarına virgül konur. Parametrelerde tip belirtilmez.
Parametre olarak verilen bir sayının karesini hesaplayıp çıktıya yazan bir fonksiyon şöyle yazılabilir.
function kare(sayi) {
console.log(sayi * sayi);
}
Bu fonksiyonu şöyle çağırabiliriz.
Çıktısı:
25
Fonksiyonlardan Değer Döndürme
Fonksiyonlar, yaptıkları işlemlerin sonucunda bir değer döndürebilirler. Fonksiyondan değer döndürmek için return ifadesi kullanılır. Bu ifadenin yanına döndüreceği değer yazılır. Fonksiyonun döndürdüğü değer fonksiyon çağrısı kullanarak (örneğin kare(5) yazarak) bir işlemde kullanılabilir veya bir değişkene atanabilir.
Bir sayının karesini hesaplayıp sonucu döndüren bir fonksiyon şöyle yazılabilir:
function kare(sayi) {
var karesi = sayi * sayi;
return karesi;
}
veya
function kare(sayi) {
return sayi * sayi;
}
Bu fonksiyonu diğer fonksiyonlar gibi parametreleri ile beraber adını yazarak çağırırız. Ancak farklı olarak bundan bir değer döneceğinden bu değeri bir yerlerde kullanabiliriz.
Örneğin:
var besinKaresi = kare(5); // kare(5) ile dönen değeri besinKaresi değişkenine ata.
console.log(besinKaresi);
Çıktısı:
25
veya
var birSayi = 5 + kare(5) * 2; // kare(5) ile dönen değeri bir matematiksel işlemde kullanıyor.
console.log(birSayi);
Çıktısı:
55
veya
var sonuc = kare(5);
var birSayi = 5 + sonuc * 2;
console.log(birSayi);
Çıktısı:
55
Değer döndürmeyen bir fonksiyonun döndürdüğü sonuc undefined isimli özel bir değerdir. Bu değer tanımlanmamış anlamındadır.
Örnek:
function deneme() {
// Burada return hariç bazı ifadeler olabilir
}
console.log(deneme());
Çıktısı:
undefined
Aynı şeyi return ifadesinin yanına bir şey yazmadığınızda da alırsınız.
function deneme() {
// Burada return hariç bazı ifadeler olabilir
return
}
console.log(deneme());
Çıktısı:
undefined
Fonksiyon Parametrelerini Test Etmek
Fonksiyonlara fonksiyonun tanımında yer alan parametreleri göndermek zorunlu değildir. Bu yüzden parametrenin gönderilip gönderilmediğini veya gönderilen parametrenin tipini sorgulamak durumunda kalabiliriz.
Bir parametrenin gönderilip gönderilmediğini şöyle sınayabiliriz.
function usHesapla(sayi, us) {
if (us == undefined)
us = 2;
return Math.pow(sayi, us);
}
console.log(usHesapla(2, 3));
console.log(usHesapla(3));
Çıktısı:
8
9
Gönderilmeyen parametreler undefined değeri alırlar. Örnekte parametre bu değere sahipse (tanımlanmamışsa / gönderilmemişse) parametre değişkeninin değeri 2 yapılarak sayının karesinin alınmak istendiği varsayılıyor.
JavaScript'in undefined değerini mantıksal karşılaştırmalarda false kabul etmesinden faydalanarak aynısını şu şekilde de yapabiliriz.
function usHesapla(sayi, us) {
if (!us)
us = 2;
return Math.pow(sayi, us);
}
undefined gibi boş string, null ve NaN (bir sayı değil) gibi değerler de bu örnekteki gibi test edilebilir. Bu değerler de if sınamalarında false kabul edilir. Bunların haricindeki değerler de true olarak kabul edilir.
Mantıksal olmayan değerlerin if ile sınanması işlemi genellikle bir değerin gönderilip gönderilmediğini test etmek için aşağıdaki gibi kullanılır.
function adVeSoyad(adi, soyadi) {
if (soyadi) // soyadi parametresi gönderilmişse (undefined, NaN, boş string, false ...) değilse.
return adi + " " + soyadi;
return adi;
}
Bazı durumlarda parametre ile değer gönderilmişse, gönderilen değeri, gönderilmemişse varsayılan bir değeri kullanmak için aşağıdaki gibi mantıksal karşılaştırmaların kısa devre özelliğinden yararlanırız.
function usHesapla(sayi, us) {
us = us || 2;
return Math.pow(sayi, us);
}Mantıksal karşılaştırmalarda and (&&) kullanıldığında, soldaki değer false, ise sağdaki değer true olsa da sonuç değişmediğinden sağdaki değere bakılmaz. Or (||) kullanıldığında ise soldaki değer true ise gerek olmadığından sağdaki değere bakılmaz. Soldaki değer false ise sağdaki değere göre sonuca karar verilir.. Bu çoklu mantıksal karşılaştırmaların kısa devre özelliğidir. Örnekteki;
satırında bu özellikten yararlanılmıştır. Eğer us parametresi için bir değer gönderilmişse us değişkeninin yeni değeri yine kendisi olacaktır. Ancak us için bir değer yoksa (undefined, null vs. ise) soldaki değer false kabul edildiğinden sağdaki değere bakılır ve sonuç olarak us değişkenine 2 değeri atanır. Kısa devre özelliğinden JavaScript programlamada çokça yararlanılır.
Eğer parametrenin tipinden emin olmanız gerekirse bunun için typeof kullanabilirsiniz. typeof , yanında belirtilen değerin veya değişkenin sakladığı değerin tipini tanımlayan "undefined", "object", "boolean", "number", "string", "function" veya "symbol" metinlerinden birini döndürür.
Örnek:
function usHesapla(sayi, us) {
if (typeof us !== "number")
throw "Üs değeri bir sayı olmalı."; // Bir hata fırlat. Buradan sonrası çalıştırılmaz.
return Math.pow(sayi, us);
}
Fonksiyonlarda Varsayılan Parametre Değeri Tanımlama
JavaScript fonksiyonlarında parametre değerlerine varsayılan değer atayabilirsiniz. Bu durumda parametre, karşılığında bir değer gönderilirse gönderilen değeri, gönderilmezse varsayılan değeri alacaktır. Varsayılan değer parametre isminin yanında = değer şeklinde tanımlanır.
function usHesapla(sayi, us = 2) { // us parametresinin varsayılan değeri 2'dir.
return Math.pow(sayi, us);
}
console.log(usHesapla(2, 3));
console.log(usHesapla(3));
Çıktısı:
8
9
Fonksiyonlar ve Değişken Kapsamı
Fonksiyonlar kendi dışında tanımlanan değişkenleri tanırlar. Anca bir fonksiyonun içinde tanımlanmış olan değişkenler diğer fonksiyonlar tarafından veya dışarıdan görülmezler.
Fonksiyon dışındaki değişken örneği:
var a = 5;
function deneme() {
console.log(a);
}
Çıktısı:
5
Fonksiyon içindeki değişken örneği:
function deneme() {
var a = 5;
}
console.log(a);
Çıktısı:
undefined
Çıktı olarak undefined yazılmıştır. Fonksiyonun içinde tanımlanan değişkenler fonksiyonun dışından görülmezler.
Fonksiyon İçinde Fonksiyon Tanımlama
Bir fonksiyonun içinde fonksiyon tanımlanabilir. Ancak bu fonksiyonun referansı döndürülmediği sürece başka fonksiyonlar tarafından tanınmazlar. Sadece tanımlandığı fonksiyonun içinde kullanılabilirler.
Örnek:
function hipotenusHesapla(aKenari, bKenari) {
function sayininKaresi(s) {
return s * s;
}
return Math.sqrt(sayininKaresi(a) + sayininKaresi(b));
}
console.log(hipotenusHesapla(3, 2));
Çıktısı:
3.605551275463989
Örnekteki hipotenusHesapla fonksiyonunun içinde tanımlanan sayininKaresi fonksiyonu sadece hipotenusHesapla fonksiyonu içinden kullanılabilir.
Fonksiyonun Yeniden Tanımlanması
Bir fonksiyon tanımı daha sonra değiştirilebilir. Fonksiyon çağırıldığında en son hangi durumu bildirilmişse o durum çalıştırılır.
Örnek:
function deneme() {
console.log("1. sürüm");
}
deneme();
function deneme() {
console.log("2. sürüm");
}
deneme();
Çıktısı:
2. sürüm
2. sürüm
Görüldüğü gibi 1. sürüm yazan fonksiyon hiç çalıştırılmadı. Çünkü 2. sürüm yazan fonksiyon tanımlandığında yok oldu. Ayrıca fonksiyon tanımlamaları hafızaya alınmadan hiç bir fonksiyonun çalıştırılmadığına dikkat edin.
Aynı adlı yeni fonksiyon eskisini yok edeceğinden, fonksiyonları tanımlarken eğer kasten yapmıyorsanız var olan fonksiyon isimlerini kullanmayın. Özellikle kullandığınız kütüphanelerin fonksiyon adlarına dikkat edin ve kullanmayın. Aksi halde kütüphaneyi kullanamazsınız. Örneğin JQery kütüphanesini kullanıyorsanız $ isimli bir fonksiyon oluşturmayın.
JavaScript fonksiyonları genişçe bir konudur. Bu yüzden bir kaç makaleye bölünmüştür. Fonksiyonlarla ilgili diğer konular diğer makalelerde yer almaktadır.
JavaScript Fonksiyonları ile İlgili Makaleler:
