Yükleniyor...

Fonksiyonlar

Döngüler işin ne zaman tekrarlanacağını yönetir. Fonksiyonlar başka bir soruya cevap verir: bir iş bloğunu nereye koyarsınız ki adıyla yeniden çalıştıralım? Fonksiyon adlı bir tariftir. Bir kez tanımlarsınız. Bu adımlara ihtiyaç olduğunda çağırırsınız. Kopyala-yapıştır soluklaşır; ad kalır.

Fonksiyon nedir?

JavaScript’te function anahtar sözcüğü, bir ad, () parantezleri ve { } içinde gövde ile bildirirsiniz. Fonksiyonu çağırana — ad artı () — kadar gövdede hiçbir şey çalışmaz. Düşünün: «adımları paketle, sonra oynata bas.»

Bir fonksiyonun parçaları

📊 Fonksiyon anatomisi

Parça Rol Günlük uyum
function anahtar sözcüğü bildirimi başlatır «buraya adlı bir tarif geliyor»
ad sonra böyle çağırırsınız sayHi, showTotal — net fiiller yardım eder
addan sonra () çağrı yeri / sonra girdiler boş () yine «şimdi çalıştır» demektir
{ } gövde her çağrıda çalışan adımlar log, hesap, sayfa güncelleme
çağrı name() gövdeyi şimdi çalıştırır gövdeyi yeniden yazmadan yeniden kullan

Yalnızca tanımlamak tarifi saklar. Çağırmak çalıştırır. Çağırmazsanız gövde sessiz kalır — dilde normaldir, hata değildir.

Tanımla ve çağır

javascript 
function sayHi() {
console.log("Hi");
}
sayHi();

Önce tanımla, sonra çağır

İlk üç satır sayHiyi tanımlar. Son satır çağırır. Konsolda Hi görmelisiniz. sayHi(); olmadan fonksiyon vardır ama çalışmaz.

Aynı fonksiyonu iki kez çağır

javascript 
function beep() {
console.log("beep");
}
beep();
beep();

Tek gövdeyi yeniden kullan

Bir tanım, iki çağrı — beep iki kez yazdırılır. Fikir budur: adımları bir kez yazın, hikâye o sesi istediğinde yeniden çalıştırın. Gövdeyi sonra değiştirmek, bu adı kullanan her çağrı yerini günceller.

Gövgede birkaç adım

javascript 
function showReady() {
console.log("loading");
console.log("ready");
}
showReady();

Gövde birkaç adım tutabilir

Bir çağrıda her iki satır sırayla çalışır: önce loading, sonra ready. Fonksiyon tek ifadeyle sınırlı değildir — küçük görevin tamamını süslü parantezlere koyun.

Fonksiyon içinde yerel iş

javascript 
function greetCity() {
let city = "Tehran";
let line = "Hello from " + city;
console.log(line);
}
greetCity();

Yerel iş tarifin içinde kalır

city ve line greetCity içinde yaşar. Her çağrı mesajı kurar ve Hello from Tehran yazar. Bu kalıpta dışarıda bu adlara gerek yok — tetikleyici çağrıdır.

Sayfa öğesini doldur

javascript 
function fillOut() {
let box = document.getElementById("out");
box.textContent = "Function ran";
}
fillOut();

Sayfa için iş çalıştırın

Önceki DOM dersleriyle aynı fikir: öğeyi bulun, textContent atayın. Fonksiyona sarmak; düğme, zamanlayıcı veya betik sayfa güncellenmeliyken fillOut() çağırabilir — bir ad, bir iş.

Fonksiyonu sayfada gösterin

Bir paragrafa kısa bir satır yazan fonksiyon tanımlayın, sonra betikten çağırın ki ziyaretçi sonucu görsün.

Sayfada fonksiyon çağrısı

html 
<!DOCTYPE html>
<html>
<head>
<title>functions — page</title>
</head>
<body>
<p id="msg">…</p>
<script>
function showMsg() {
let box = document.getElementById("msg");
box.textContent = "Hello from a function";
}
showMsg();
</script>
</body>
</html>

Sayfa Hello from a function gösterir. showMsg gövdesi DOM’a yazdı; alttaki çağrı oynata bastı. Dizgiyi değiştirin, yenileyin, yeni satırı okuyun. Sonraki ders parametrelere iner — çağırırken paranteze gönderdiğiniz değerler.

Kendiniz deneyin

  1. "hello" yazdıran function hello() bildirin ve bir kez çağırın.
  2. Gövdeyi yeniden yazmadan aynı fonksiyonu ikinci kez çağırın.
  3. Gövdesi sırayla iki farklı kelime yazdıran bir fonksiyon yapın.
  4. Fonksiyon içinde let ile bir dizgi kurun ve yazdırın.
  5. #out değerini "ok" yapan bir fonksiyon yazın (veya demodaki id’yi kullanın).
  6. HTML demoda yalnızca mesajı değiştirin, yenileyin, paragrafı okuyun.

Sık hatalar

  • Fonksiyonu tanımlayıp () ile çağırmayı unutmak
  • () olmadan sayHi yazmak — adı söyler, gövdeyi çalıştırmaz
  • Bir fonksiyonu iki kez çağırmak yerine aynı satırları kopyalamak
  • İşi { } dışına koyup fonksiyon adının ona «sahip» olmasını beklemek
  • Bu dersi parametre/return ile karıştırmak — onlar sonra; burada tanım + çağrı

Özet

  • Fonksiyon adımları bir ad altında paketler
  • function name() { … } ile bildirin
  • Gövdeyi çalıştırmak için name() ile çağırın
  • Bir gövde, çok çağrı — yeniden kullanım budur
  • Gövde birkaç ifade ve let ile yerel iş tutabilir
  • Sayfa güncellemeleri, ihtiyaç olunca çağırdığınız fonksiyona uyar
  • Sonraki: parametreler — çağrıda değer geçirin

🧠 Bilginizi Test Edin

Başlamaya Hazır

Bilginizi Test Edin

Bu interaktif sınavla kendini test et ve konuyu ne kadar iyi anladığını gör

❓
8
Sorular
🎯
70%
Geçmek İçin
♾️
∞
Süre
🔄
∞
Deneme

📝 Talimatlar

  • Her soruyu dikkatle okuyun
  • Her soru için en iyi cevabı seçin
  • Quiz'i istediğiniz kadar tekrar alabilirsiniz
  • İlerlemeniz üstte gösterilecek
Konu 27 / 29
Javascript Ders