JAVASCRİPT FONKSİYON KULLANIMI - WebCebir

×

• ANASAYFA
• HTML
• CSS
• PHP
• JAVASCRİPT
• REACT

JAVASCRİPT FONKSİYON KULLANIMI

Fonksiyon, belirli sayıda verileri kullanarak bunları işleyen ve bir sonuç üreten komut grubudur. Her fonksiyonun bir adı ve fonksiyona gelen değerleri gösteren parametreleri (bağımsız değişkenleri) vardır. Her fonksiyonda parametre olması zorunlu değildir. Parametresiz fonksiyonlar, adından da anlaşılacağı gibi herhangi bir parametreye gerek duymadan ve fonksiyonda tanımlanan kodların yerine getirilmesi ile çalışan fonksiyonlardır. Aşağıda ki şekil fonksiyonların çalışma prensibini gösteriyor.

Fonksiyonların genel özellikleri

• Bir amaca hizmet eden program parçacıklarıdır.
• Fonksiyon çalıştırıldığında, bir işlemi yerine getirmesi yada bir değer döndürmesi istenecektir.
• Çağrılmış olan bir fonksiyon ya geriye bir sonuç değeri döndürür ve/veya fonksiyon içerisindeki operasyonlarını işlemlerini tamamlayıp çağrılan yere geri döner.
• Diğer programlama dillerinde metod,prosedür (yordam) v.b isimlendirme ile adlandırılırlar.
• Programcılar, programların yapacağı işi fonksiyonlar vasıtasıyla anlamlı parçalara bölerek programlarının modülerlik kazanmalarını sağlar.

javascript dilinde hazırlanan bir fonksiyonun genel yapısı şöyledir:

function fonksiyon_Adı (parametre1,parametre2,....paremetreN)

{

İŞLEMLER

}

Parametresiz basit bir fonksiyon örnek verelim.

JavaScript:

function mesaj() { alert("merhaba javascript dünyası"); } mesaj(); //fonksiyon çağrılıyor mesaj(); //fonksiyon çağrılıyor

Yukarıda örnekte mesaj fonksiyonumuz iki kere çağrıldı. Ekrana iki kere mesaj kutusu çıkacak.

fonksiyon çağırma

• Bir olay meydana geldiğinde (Bir kullanıcı bir düğmeye tıkladığında)
• Doğrudan çağrılan fonksiyonlar
• Otomatik (kendi kendine çağrılan)

Not : javaScript büyük harf küçük harf farkına duyarlıdır; Bu yüzden javaScript fonksiyon adları tanımlama ve fonksiyonu çağırırken harflerin büyük ya da küçük oluşuna dikkat etmek gerekiyor.

Parametre ve Argüman Kavramı

Fonksiyon bildiriminde, fonksiyona girdi olarak, kullanılan değişkenlere parametre denir. Argüman ise fonksiyon çağrılırken gönderilen değere(lere) verilen addır. Bunun yanısıra fonksiyonlarda argüman kullanma zorunluluğu yoktur.

// Fonksiyon bildiriliyor function topla(x,y) // Burada x ve y parametre { return (x+y); } //Fonksiyon çağrılıyor t = topla( 7,3 ); // Burada 7 ve 3 argüman

Argümanların giriliş sırası ( 7,3 )'e göre parametre değer sırasıda aynı sırayla görünmesi gerekir. "x=7" atanır ve "y=3" atanır unutmayın.

ÖRNEK:

function okul (ad,sinif) { alert ( "Hoşgeldiniz " + ad + "," + sinif ); }

HTML:

<button onclick = "okul('Ali','9A')">buraya tıklayın </button> <button onclick = "okul('Hasan','8B')">buraya tıklayın </button>

Neden Fonksiyonlar?

Farklı Argümanlar ile aynı kodu birçok kez kullanabilirsiniz, ve farklı sonuçlar elde edersiniz.

ÖRNEK:

HTML:

<p id="demo"> </p>

javaScript:

function derece(fahrenheit) { return (5/9) * (fahrenheit-32); } document.getElementById("demo").innerHTML = derece(77);

Yukarıda ki örnekte farklı Fahrenheit girerek farklı Derece, sonuçları elde edilir.

Fonksiyonlar değişken olarak kullanma

Fonksiyonları değişkene atayarak başka javaScript işlemlerinde kullanılır.

ÖRNEK:

var x = derece(32);

Fonksiyonlarda geri dönüş (return)

return anahtar sözcüğünün iki önemli işlevi vardır:

• fonksiyonun geri dönüş değerini oluşturur.
• fonksiyonu sonlandırır.

Bu return deyiminden sonra bir değişken, işlem, sabit veya başka bir fonksiyon yazılabilir. Örneğin:

javaScript:

return (x+y/2); //Parantez kullanmak zorunlu değil return 20; //Değişken kullanmak mecburu değil return topla(x,y)/4.0; // Önce topla fonksiyonu çalışır

Bir fonksiyonda birden çok geri dönüş değeri kullanılabilir. Fakat, ilk karşılaşılan return deyiminden sonra fonksiyon sonlananır, ve çağrılan yere bu değer gönderilir. Örneğin aşağıdaki sinif fonksiyonunda beş tane return deyimi kullanılmıştır.

function sinif(not) { if( not>=0 && not=50 && not=70 && not=80 && not=90 ) return 'A'; } var y = sinif(60); alert(y);

Bu fonksiyon kendisine parametre olarak gelen 0-100 arasındaki bir notun harf karşılığını gönderir. Aslında geri gönderilen değer bir tanedir.

Sayının karesini döndüren fonksiyon hazırlayalım.

javaScript:

function kare(x) { return x * x; } var y = kare(5); alert("sonuc...:"+y); // çıktı:25

HTML etiketlerin içinden parametreli fonksiyonumuzu çağıralım.

javaScript

function degistir_text (x) { x.innerHTML = "Teşekkürler!"; }

HTML:

<h1 onclick = "degistir_text (this)" > metnin üzerine tıklayın</h1>

ÇIKTI:

metnin üzerine tıklayın

HTML etiketlerin içinden fonksiyonumuzu çağıralım.

javaScript:

function displayDate() { document.getElementById("demo").innerHTML=Date(); }

HTML:

<p id="test"><p> <button onclick="displayDate()">Buraya tıklayın</button>

ÇIKTI:

Buraya tıklayın

Barış Sevinç 22/09/2019

Boş bir sayfaya rastgele bir resim koyuyorum. function kullanarak resmi değiştirme butonu koyuyorum. yani butona tıkladığımda linkini koyduğum ikinci resme değiştiriyor. Farklı bir buton yapıp geri döndürme işlemini yapamadım nasıl yapabilirim. yani ikinci bir buton koyup tıkladığımda ilk resme geri dönsün. teşekkürler.

yönetici 22/09/2019

Barış, setAttribute ile resmin "src" niteliğine resmin yolunu göster. Konuya bakın.

Mesut 03/12/2019

10 soruluk bir testte her bir sorunun 4 şıkkı var. Şıklardan sadece biri doğru cevap. her bir soru için ayrı ayrı şıkka tıkladığımda şık doğru ise buton yeşil, yanlış ise buton kırmızı yapmak istiyorum. Yardımcı olur musunuz yada hangi konuları araştırmam lazim

yönetici 05/12/2019

Mesut, her soru paragrafın yanındaki butona çeşitli id'ler ver ve class atayarak veya direkt stil verek rengini değiştirebilirsin. şu konuya bak ve şu konuya bak.

Elvan 01/05/2020

Seçtiğim daire numarasına göre öznitelikleri göster butonuna tıkladığımda o daireye ilişkin öznitelikleri görmek istiyorum nasıl yapabilirim?

yönetici 01/05/2020

Elvan, nodevalue kullanarak yapılır şu konuya bakın.

Hamza 07/07/2021

Bir hava durumu uygulaması yapmaya çalışıyorum bunun için girilen şehir değişecek fakat fonksiyondan url'yi geri alamıyorum. Yardımcı olursanız sevinirim

yönetici 11/07/2021

javascript, getAttribute() yöntemi ile link değerini alabilirsin. getAttribute() Lütfen konu haricinde soru sormayın cevaplanmayacaktır. Yorumunuz onaylandıktan sonra yayınlanacaktır. Lütfen Yukarıda ki mesajları okuyun tekrar aynı soruları sormayın.

3814

Gönder KATEGORİ

• HTML
• CSS
• PHP
• JQUERY
• PHOTOSHOP
• JavaScript
• Web Dünyası
• Linux
• MİTHRİL FRAMEWORK
• Laravel
• Git
• React

POPÜLER MAKALE

• HTML LİNK(Bağlantı)EKLEME - LİNK VERME
• HTML YAZI VE RESİM ORTALAMA
• HTML RESME LİNK VERME
• HTML FORM OLUŞTURMA
• CSS YATAY MENÜ YAPIMI
• HTML RESİM EKLEME
• CSS (BOYUT) GENİŞLİK VE YÜKSEKLİK (Width-Height)
• HTML DİV ve SPAN NEDİR?
• HTML ARKAPLANA MÜZİK EKLEME
• KALİTE KAYBETMEDEN RESİMLERİ BÜYÜTME

ETİKET

• html dersleri
• HTML
• css dersleri
• CSS
• php dersleri
• PHP
• javaScript dersleri
• JAVASCRİPT
• jquery dersleri
• JQUERY

HTML ÖNEMLİ KONULAR

• html müzik ekle
• html video player
• html arkaplan resmi ekleme
• html listeler
• HTML ile Tablolar Oluşturmak

CSS ÖNEMLİ KONULAR

• Css Websayfasına Nasıl Eklenir
• Html dom nedir?
• CSS Renk Tanımlamaları
• CSS ZEBRA DESENLİ TABLO
• CSS Z-İNDEX NEDİR?

PHP ÖNEMLİ KONULAR

• php Değişken nedir?
• php unset kullanımı
• PHP empty() Fonksiyonu Kullanımı
• php if else kullanımı
• Php strtolower() ve strtoupper() Fonksiyonları

JAVASCRİPT ÖNEMLİ KONULAR

• javascript comfirm nedir?
• JavaScript Çıktı Türleri Nelerdir?
• javascript appendChild-insertBefore
• javascript parentNode-firstChild-lastChild
• javascript getElementById- querySelector

JQUERY ÖNEMLİ KONULAR WEBCEBİR © 2013 Tüm hakları saklıdır.