JavaScript Fonksiyon Kullanımı Nedir? (Function) - Tasarım Ve Yazılım

Bu yazımızda javascript fonksiyon kullanımı örneklerle anlatacağız. function teriminden gelir ve anlamı fonsiyondur. Function çok kullanılan bir yapıdır. Javascript te bir işlemi yapan fonksiyon (function ) yazılır ve sonrasında o işlem gerektiğinde sadece yazılan fonksiyon ( function ) çağrılır. Bu da bize defalarca aynı kodları yazmamıza gerek kalmamış oluyor. Hem zaman kazancı sağlıyor hem de kod fazlalığından kurtarıyor.Kod yapısı aşağıdaki gibidir:

function fonksiyonİsmi(parametre) { Çalışmasını istediğimiz kodlar... }

Yukarıdaki görüldüğü gibi bir yapısı vardır. Fonksiyon ismi, parametre ve kod bloğundan (kod blogu: {} parantezler arası) oluşur. Fonksiyonun kod bloğuna fonksiyonun kapsama alanı denir. Fonksiyonun kapsama alanı içindeki yaptığımız tanımlamalar kapsama alanından çıkınca geçerliliğini yitirir.

Fonksiyon İsimlendirmede Dikkat Edilmesi Gerekenler:

1. Fonksiyon isimleri her zaman anlamlı olarak kullanılmalıdır. Bunun sebebi ileride function aradığımızda daha rahat bulmak içindir. Anlamsız isim verdiğimizde çalışmasında herhangi farklılık yoktur.
2. Fonksiyon isimleri harfler, _ (alt çizgi) ve $ (dolar) işareti ile başlayabilir. ( Türkçe karakterler kullanılması tavsiye edilmez.)
3. Fonksiyon isimleri hiçbir zaman rakam ile başlayamaz. (Rakamlar ilk karakterden sonra kullanılabilir.)
4. Fonksiyon isimleri Javascript tarafından kullanılan kelimeleri içeremez. Yani if, for, forin, gibi isimleri…
5. Aynı isimde iki fonksiyon yazılamaz.
6. Fonksiyon isimleri küçük harf / büyük harf duyarlıdır.

Javascript function () tanımlamayı basit örnekle yapalım anlatalım.Örnek: Basit function () tanımlama ve kullanma:

function merhaba() { document.write("merhaba dünya"); }// ilk satırdan buraya kadar kısım tanımlama merhaba();// bu satırda foksiyonu çağırdık

Yukarıdaki örnekte gördüğünüz gibi function () tanımladık ve sonrasında sadece adı ile fonksiyonu çağırdık. Bundan sonra sadece ismi ile istediğimiz kadar fonksiyonu istediğimiz yerde kullanabiliriz.

Javascript Fonksiyon ( function ) İşlemlerinde return Kullanımı

Javascript te return kullanımı, fonksiyonun bize bir değer döndürmesi için kullanılır. Basit bir string değer veya matematiksel bir işlemi yapıp sonucunu bize döndürmesini de isteyebiliriz.Örnek yapalım:

function topla() { var sayi1 = 15; var sayi2 = 25; return sayi1 + sayi2 ; }

Yukarıdaki örneğimizde toplama işlemini yapıp bize sonucunu döndüren bir fonksiyon yazdık. return ifadesi fonksiyonun yazıldığı yerde fonksiyonu bitirir. Yani return ifadesinden sonrasında kod varsa onları fonksiyon değerlendirmez. Örnek:

function denemeFonk() { document.write("deneme1 <br/>"); document.write("deneme2 <br/>"); return ; document.write("deneme3 <br/>"); } denemeFonk();

Yukarıdaki örneğimizde deneme1 ve deneme2 yazısını html sayfasına yazdırır. Ama deneme3 yazısını yazdırmaz. Çünkü return ifadesini fonksiyon görünce devamındaki kodları işlemez…

Fonksiyonu otomatik olarak çalıştırmak için fonksiyonu parantez içine alıp ve önüne de parantez açıp kapatmamız yeterlidir. Örnek:

(function denemeFonk() { document.write("Deneme yazısı..."); })();

Javascript Fonksiyon İşlemlerinde Parametre Tanımlama

Fonksiyon ( function ) oluştururken parametre değerlerini kullanarak oluşturduğumuzda o değerleri kullanarak çağırmamız gerekir. Örnekle anlatalım:

function helloFunc(name) { document.write("Hoşgeldiniz " + name ); } helloFunc("Mutlu");

İki sayıyı parametre olarak girdiğimizde bize toplayıp döndüren fonksiyonu yapalım:

function toplaFunc(sayi1, sayi2){ var sonuc = sayi1 + sayi2; return sonuc; } toplaFunc(5,10);

Javascript Fonksiyon İşlemlerinde Varsayılan Parametre ile Tanımlama

Fonksiyon tanımlarken bazı durumlarda parametreyi varsayılan olarak tanımlarız. Bir parametreyi sabit(varsayılan) tanımladığımızda daha sonra ona değer girebiliriz. Amaç çoğunlukla sabit olan değerlerde kullanılan bir parametreyi sürekli yazma yerine sabit olarak tanımlamaktır. Değer değişmesi gerektiğinde parametreye değer girmemiz yeterli olacaktır. Bir örnekle anlatalım.

function kdvHesapla(fiyat, kdv=18){ var sonFiyat= fiyat + ((fiyat/100) *kdv ) ; document.write(sonFiyat); } kdvHesapla(100);//kdv sabit %18 den hesaplar kdvHesapla(100,8);// kdv parametresine atadığımız %8 den hesaplar.

Javascript Fonksiyonlar da Constructor Fonksiyon Oluşturma

Bu tip fonksiyonlar nesneleri daha pratik bir şekilde oluşturmak için kullanılan fonksiyonlardır.Örnek :

function Person(name, surname, age) { this.name = name; this.surname = surname; this.age = age; this.fullname = function () { return this.name + this.surname; } } const Person1 = new Person("tasarım", "dersleri", 33); const Person2 = new Person("yazılım", "dersleri", 34);

Yukarıdaki örnekte gördüğümüz gibi Person diye constructor fonksiyon oluşturduk ve daha sonra onu kullanarak nesnelerimizi oluşturduk.

Javascript İçiçe Fonksiyon ( function ) Tanımlama

Bazı durumlarda tanımladığımız fonksiyon içinde farklı bir işlem yapmak için fonksiyon tanımlamamız gerekir. Bu tip durumlara bir örnek yapalım.

Örnek: Girdiğimiz para birimi ve tutarını hesabını yapıp sonucu bize döndüren fonksiyon örneğini yapalım.

function dovizBilgi(birim, tutar) { if(birim=="Aparası"){ var kur= 1; }else if (birim=="Bparası") { var kur= 2; }else if (birim=="Cparası") { var kur= 3; } function dovizHesap(kur, tutar) { var sonuc = kur * tutar ; document.write(sonuc) } return dovizHesap(kur,tutar); } dovizBilgi("Bparası", 250);

Fonksiyonlarda ( function ) length Kullanımı

Fonksiyon (function) length kullanımı ile fonksiyon da kaç tane parametre olduğunu öğreniriz. Örnek yapalım:

function myFunc(par1, par2, par3){ var sonuc = myFunc.length; document.write(sonuc); }

Fonksiyonlarda ( function ) arguments Kullanımı

Fonksiyon arguments kullanımı, fonksiyon oluşturulurken parametre atanmasa da sonradan gönderilen parametreleri bize döndürmesi içindir. Örnek yapalım:

function myFunc(){ var sonuc = arguments.length; document.write(sonuc); } myFunc("parmet1", "parmet2", "parmet3", "parmet4"); myFunc(1,2,3,4,5);

Yukarıdaki örnekte gördüğümüz gibi fonksiyonu kaç parametre ile gönderirsek bize döndürür.

Fonsiyonlarda ( function ) caller Kullanımı

Fonksiyon caller kullanımı, fonksiyonu çağıran başka bir fonksiyon tarafından referans alınarak tüm bilgilerin elde edilmesi sağlanır. Bir örnek yapalım:

function myFunc1() { for (let i = 0; i < myFunc1.caller.arguments.length; i++) { document.write(myFunc2.arguments[i] + "<br/>"); } } function myFunc2(param1,param2) { myFunc1(); } myFunc2("tasarım", "yazılım");

Değişken içerisinde fonksiyon tanımlama işlemine örnek yapalım:

var merhaba = function () { document.write("merhaba dünya"); } merhaba();

Kendi Kendini Çağıran Fonksiyon Örneği Yapalım:

function tekrarla(startValue, endValue) { if (startValue <= endValue) { document.write("aaaaa <br/>"); startValue++; tekrarla(startValue,endValue); } else{ return; } } tekrarla(1,10);

Başka bir yazımızda görüşmek üzere…

Tweet