Atölye › Dört Bağla › 2/38. adım

Çizen bir fonksiyon

Ne yapıyoruz

Diskler düştükçe resim değişecek; o yüzden resmi tekrar tekrar çizebilmeliyiz. Bunun yolu çizim satırlarını bir fonksiyonun içine koymak.

Fonksiyon bir tarif gibidir: önce tarifi yazarsın (tanımlama), sonra adıyla uygularsın (çağırma). Ekranda bir şey değişmeyecek; ama artık çizim bir adla çağrılabiliyor.

```js
function draw() {
  ctx.fillStyle = '#0f172a'
  ctx.fillRect(0, 0, canvas.width, canvas.height)
}

draw()
```

Ne işe yarıyor

function draw() { → fonksiyon tanımlar: "draw deyince şunları yap". Bu satır tek başına bir şey çizmez.
{ ile } arasındaki satırlar fonksiyonun gövdesi. Okunaklı olsun diye iki boşluk içeriden yazılır.
draw() → fonksiyonu çağırır: tarifi şimdi uygula. Sondaki () "çalıştır" demektir.

Sıra sende

İki boyama satırının üstüne function draw() { yaz.
İki satırı iki boşluk içeri al (satır başında Tab da olur); altlarına kapanan } koy.
Bir boş satırdan sonra draw() yaz.
Çalıştır: ekran aynı görünmeli.

Beceriler: Fonksiyonlar

← Koyu bir arka plan Mavi tahta →

Çizen bir fonksiyon

Ne yapıyoruz

Ne işe yarıyor

Sıra sende

Tüm adımlar