JavaScript Fonksiyonları
Fonksiyon function anahtar kelimesi bir boşluk fonksyion adı ve parantez ile tanımlanır.
Fonksiyon isimlerinde harf, rakam, alt çizgi ve dolar işareti olabilir. (değişken tanımlama kuralları ile aynı)
Birden fazla parametre parantez içerisinde virgülle ayrılır. (parametre1, parametre2, parametre3, … )
Fonksiyon kodları süslü parantez { . . . } içerisine tanımlanır ve istedeğimiz zaman Fonksiyonu çağırabiliriz.
Fonksiyon function anahtar kelimesi bir boşluk fonksyion adı ve parantez ile tanımlanır.
Fonksiyon isimlerinde harf, rakam, alt çizgi ve dolar işareti olabilir. (değişken tanımlama kuralları ile aynı)
Birden fazla parametre parantez içerisinde virgülle ayrılır. (parametre1, parametre2, parametre3, … )
Fonksiyon kodları süslü parantez { . . . } içerisine tanımlanır ve istedeğimiz zaman Fonksiyonu çağırabiliriz.
JavaScript:
function fonksiyonismi(parametre_1, parametre_2) {
// Kodlar Buraya Gelecek
}
Fonksiyon Çağırmak
JavaScript'te fonksiyon çağırmak için belirli parametreler belirtilmiştir. Bunlara kısacak değinirsek butona tıklanınca fonkiyonlar oluşturmak, Butonun üzerine gelince veya butonun iki kere basınca vb. işlemlerde fonksiyonlar kullanılır. Aşağıdaki örnekte buna bakalım!
JavaScript'te fonksiyon çağırmak için belirli parametreler belirtilmiştir. Bunlara kısacak değinirsek butona tıklanınca fonkiyonlar oluşturmak, Butonun üzerine gelince veya butonun iki kere basınca vb. işlemlerde fonksiyonlar kullanılır. Aşağıdaki örnekte buna bakalım!
HTML:
<button onClick="fonksiyonismi();">Merhaba</button> <!-- Butona tıklayınca (onclick) ve fonksiyon adı belirtilir. -->
<script>
function fonksiyonismi() {
alert("Hello World");
}
</script>
Parametrelerin Kullanımı
HTML'de veya CSS'de parametre belirtilir. Bu parametreler değişkenler gibidirler. İçerisine belirtiğimiz değerler fonksiyonlar ile şekillendirilir.
HTML'de veya CSS'de parametre belirtilir. Bu parametreler değişkenler gibidirler. İçerisine belirtiğimiz değerler fonksiyonlar ile şekillendirilir.
HTML:
<button onClick="uyari('merhaba')">Bana Tıkla</button> <!-- Bu kısımda 1. parametreye "merhaba" adını belirttim. -->
<script>
function uyari(x) { // 1. Parametrenin değeri x'e ata dedim.
alert(x) // X'i yazdırdım.
}
</script>
JavaScript'in içinde Fonksiyon kullanma
JavaScript'teki fonksiyonlar değişken gibidirler. Fonksiyonlar'ı araba gibi düşünürsek bu fonksiyonları çalıştırmak için bir anahtarın olması lazım. Fonkiyonlar oluşturulurken bu fonksiyonları çalıştıracak kodlarda lazım. Aşağıdaki örnekte daha detaylı görebilirsiniz.
JavaScript'teki fonksiyonlar değişken gibidirler. Fonksiyonlar'ı araba gibi düşünürsek bu fonksiyonları çalıştırmak için bir anahtarın olması lazım. Fonkiyonlar oluşturulurken bu fonksiyonları çalıştıracak kodlarda lazım. Aşağıdaki örnekte daha detaylı görebilirsiniz.
JavaScript:
function fonksiyonadi() { // Fonksiyonumu belirttim.
alert("Merhaba"); // Fonksiyonumun içine uyarı mesajı belirttim.
}
fonksiyonadi(); // Bu parametre ise fonsiyounun çalışması için bir parametredir. Bunu yazmazsanız fonksiyon çalışmayacaktır.
JavaScript'te event kullanımı
Normalde HTML'de onClick gibi atributte'ler kullanıyorduk. Fakat bunu HTML olmadan JavaScript'te kullanımını göreceğiz.
Normalde HTML'de onClick gibi atributte'ler kullanıyorduk. Fakat bunu HTML olmadan JavaScript'te kullanımını göreceğiz.
JavaScript:
var button = document.getElementById("buton");
button.onclick = function() {
alert("Merhaba");
}
Hepsiyle bir örnek yapalım.
HTML:
<button onClick="yazi1();">1. Buton</button>
<button onClick="yazi2('2. Yazı');">2. Buton</button>
<button id="buton3">3. Buton</button>
<script>
function yazi1() {
alert("1. Yazı");
}
function yazi2(x) {
alert(x);
}
var buton3 = document.getElementById("buton3");
buton3.onclick = function() {
alert("3. yazı");
}
function yazi4() {
alert("4. yazı")
}
yazi4();
</script>