JavaScript Fonksiyonlar Nedir ve Nasıl Kullanılırlar?
Javascript fonksiyonlar konusu en önemli konulardan biridir. Çünkü fonksiyon yazılmadan değil JavaScript hiçbir yazılım dilinin sağlıklı bir şekilde kullanılmasından söz edilemez. Peki nedir bu fonksiyonlar? Fonksiyon program içinde programın akışının doğal seyri içinde yer almayan ancak çağrıldığı durumlarda işleyen ve içinde çalıştırılmak istenen kod satırlarını tutan bir kodlar kümesidir. Fonksiyonları değer döndüren ve değer döndürmeyenler olarak iki yarı başlıkta inceleyeceğiz.
JavaScript Değer Döndürmeyen Fonksiyonlar
Javascript değer döndürmeyen fonksiyon yapısının temel kullanım şeklini inceleyelim.
<script type="text/JavaScript">
function fonksiyon_adi(parametreler){
// yapılacak işlemler
}
</script>
Yukarıdaki tanıma bakarsak bir fonksiyonun tanımlanması içinde başında function anahtar kelimesinin kullanılması zorunludur. Daha sonra aynı değişkenlerde olduğu gibi her fonksiyon kendine ait bir isimle oluşturulurlar ve bu isim başka fonksiyonlar tarafından kullanılamaz. Bir fonksiyon dışarıdan değer alsa da almasa da parantez açma kapama işlemi yapılmak zorundadır. Eğer dışarıdan değer alacaksa alacağı değer sayısı kadar parantez içinde bunlar parametre olarak belirtilirler. En son kısımda da fonksiyon içinde çalıştırılmak istenen kodlar süslü parantezler içinde yazılırlar. Şimdi tüm bu anlattıklarımızı bir örnek ile görelim.
<html>
<head>
<title> Fonksiyon Denemesi </title>
<script type=”text/JavaScript”>
function uyari()
{
alert(“Fonksiyon çalışmaktadır.”);
}
</script>
</head>
<body>
<script type=”text/JavaScript”>
uyari();
</script>
</body>
</html>
Yukarıdaki örneğimizi inceleyelim. Öncelikle şunu vurgulamakta fayda var. Script etiketi altındaki kodlarımızı head etiketleri içinde yazmak hem genel bir kullanım şeklidir hem de okunurluk açısında son derece önemlidir. Çünkü body etiketleri içerisinde site tasarımını oluşturan etiketler olacağı için bunların üzerine bir de javascript kodlarını eklemek sadece ortalığı karıştıracaktır. Şimdi örneğe gelirsek, uyari adında bir fonksiyon oluşturulmuş ve bu fonksiyona herhangi bir parametre değeri verilmemiştir. Body içerisinde uyari(); şeklinde fonksiyon çağrılarak fonksiyon çalıştırılmış ve fonksiyon içindeki alert() komutu da ekrana “Fonksiyon çalışmaktadır.” Uyarısını vermiştir. Şunu unutmayın ki bir fonksiyon çağrılmadığı sürece asla çalışmaz.
Şimdi de parametre alan bir fonksiyon örneği yapalım ve onun nasıl çalıştığını görelim.
<html>
<head>
<title> Fonksiyon Denemesi </title>
<script type=”text/JavaScript”>
function topla(bir,iki)
{
var toplam=bir+iki;
document.write(toplam);
}
</script>
</head>
<body>
<script type=”text/JavaScript”>
topla(5,7);
</script>
</body>
</html>
Yukarıdaki örnekte de iki parametreli topla isminde bir fonksiyon tanımlaması yapılmış. Body içerisinde ise topla fonksiyonu çağrılmış ve fonksiyon çağrılırken parantez içinde de gönderilecek değerler yazılmıştır. Fonksiyon ilk değeri ilk parametre olan bir’e, ikinci değeri de ikinci parametre olan iki’ye atayarak bu iki değerle işlem yapıp sonucunda toplamı ekrana yazdırmıştır.
JavaScript Değer Döndüren Fonksiyonlar
Javascript değer döndüren fonksiyon yapısının temel kullanım şeklini inceleyelim.
<script type="text/JavaScript">
function fonksiyon_adi(parametreler){
// yapılacak işlemler
return dondurulecek_deger
}
</script>
Yukarıdaki tanıma baktığımızda değer döndürmeyen fonksiyondan çok farklı olmadığını görürüz. Değer döndüren fonksiyonların tek ve önemli farklı fonksiyon sonunda return anahtar kelimesi ile bir değişkenin değerini geri döndürmesidir. Geri döndürmekten kasıt nedir peki? Hemen bir örnek ile onu da gösterelim.
<script type="text/JavaScript">
function fonksiyon_adi(parametreler){
var degisken_adi=fonksiyon_adi(parametreler);
}
</script>
Yukarıdaki tanıma bakarsak fonksiyon önünde bir değişken tanımı yapılmış ve bu değişkenin atama kısmına fonksiyon çağırma işlemi yazılmıştır. Bunun sebebi bu fonksiyon değer döndüreceği için dönen değeri değişkenin içine atama yapacak olmasıdır. Bir örnek de değer döndüren fonksiyonlar için yapalım.
<html>
<head>
<title> Fonksiyon Denemesi </title>
<script type=”text/JavaScript”>
function topla(bir,iki)
{
var toplam=bir+iki;
return toplam;
}
</script>
</head>
<body>
<script type=”text/JavaScript”>
var toplam=topla(5,7);
document.write(toplam);
</script>
</body>
</html>
JavaScript dilinde tüm değişkenler var anahtar kelimesi ile tanımlandığı için parametre alan bir fonksiyona değer gönderirken ya da return ile değer döndürürken dikkat edilmelidir. Özellikle prompt ya da benzeri yöntemler ile kullanıcıdan bir sayı istendiğinden bunun matematiksel işleme girebilmesi için parseInt ile tür dönüşümü yapılması gerektiğini unutmayalım.
Javascript fonksiyonlar konusunu gördük. Bu konunun anlaşıldığını düşünüyorum. JavaScript ile ile konuları aşağıdaki linke tıklayarak JavaScript kategorisi altındaki başlıklardan öğrenebilirsiniz. Ayrıca aşağıdaki Instagram ve Twitter adreslerine tıklayarak bizi Instagram ve Twitter üzerinde de takip edebilirsiniz.
https://yazilimdelisi.com/category/web-gelistirme/javascript/
Sosyal Medya Hesaplarımız
