Bölüm 2 · Sunum 4

Bu x hangi x?

Bir değişken nerede doğar, nerede yaşar, nerede görünmez olur?

KapsamGlobalYerelArgüman kopyalanırGölgeleme

Sınıfta iki Ahmet var. “Ahmet!” diye seslenince hangisi döner?

Programda da aynı adı taşıyan iki değişken olabilir. Hangisinin kastedildiğini belirleyen bir kural olmalı.

Kapsam: adın geçerli olduğu bölge

Kapsam (scope)Bir değişken adının geçerli olduğu kod bölgesidir. Bu bölgenin dışında aynı ad ya tanımsızdır ya da başka bir değişkeni gösterir.
  • Bir değişkenin adı, yalnızca tanımlandığı bölgede geçerlidir.
  • Yanlış yerde tanımlanan skor, frame bitince yok olur.
  • Yanlış adlandırılan parametre, global skoru güncellemiyormuş gibi görünür.

Üç tanım yeri

Nerede tanımlanır?TürÖrnekNe kadar yaşar?
setup / draw dışında, en üstteGlobalskor, hedefX, oyunBittiSketch çalıştığı sürece
Fonksiyon gövdesinde let / constYerelGeçici hesap, döngü değişkeniFonksiyon bitene kadar
Fonksiyon parametresiYereldikdortgenCiz(x, y, w, h) içindeki xFonksiyon bitene kadar

Global değişkenler: herkes görür, değer kalır

Tuvale tıklayın. draw her frame baştan çalışsa da skor silinmiyor. Oyun durumu bu yüzden en üstte tutulur.

Herkesin dokunabildiği kutu

Bütün değişkenleri global yaptım. Her yerden erişiliyor, çok rahat!
😎
projenin ilk günü
Skor neden −40 oldu?
🤨
üç hafta sonra
Bu kutuya on dört fonksiyon dokunabiliyor. Hangisi bozdu?
🕵️
dedektiflik başlıyor

Global değişken gereklidir ama az olmalıdır: yalnızca gerçekten herkesin bilmesi gereken oyun durumu için.

Yerel değişkenler: fonksiyonla doğar, fonksiyonla ölür

  • geciciX her frame fare konumundan yeniden hesaplanır. Global tutmaya gerek yok.
  • skor birikmeli; bu yüzden global.
  • Parametreler de yereldir.
draw içindeki letHer frame’in başında yeniden yaratılır, sonunda yok olur. Kalıcı oyun durumu için kullanılamaz.

Kutular ne zaman doğar, ne zaman ölür?

bonus her çağrıda yeniden yaratılır ve fonksiyon bitince yok olur. skor ise çağrılar arasında değerini korur; bu yüzden birikebilir.

Ekranda hangi iki sayı görünür?

150 ve 100

Adları aynı olsa da iki ayrı kutu var. Çağrı anında değer kopyalanır.

Argüman, parametreye kopyalanır

x (draw)100çağıranın kutusu
→değer kopyalanır
x (konumYaz)100parametre: yeni kutu
→x = x + 50
x (konumYaz)150yalnızca bu değişti
SonuçFonksiyonun içinde parametreyi değiştirmek, çağıran taraftaki değişkeni değiştirmez.
Karışmasın diyeAdları bilerek farklı seçebilirsiniz: function konumYaz(ekranX). Davranış aynıdır, okuması kolaylaşır.

Skor artmıyor. Hata nerede?

Gölgeleme (shadowing)

GölgelemeParametre ya da yerel let adı, global bir değişkenle aynı olursa fonksiyonun içinde yerel olan kazanır. Global, o adla görünmez olur.
Burada ne oldu?Parametrenin adı da skor. Artan şey yerel kopya; global skor hâlâ 10.

Parametreye artisMiktari gibi ayırt edici bir ad verin ya da globali parametresiz, doğrudan güncelleyin. İkisini aynı adla karıştırmayın.

İki düğme, iki skor: hangisi artar?

İki düğmeye de birkaç kez tıklayın. Sağdaki fonksiyon her çağrıda 11’i hesaplar ama sonucu yerel kopyaya yazar; kopya fonksiyonla birlikte yok olur.

Bir oyunda kim global, kim yerel?

Global: oyunun durumu
  • skor, can, seviye
  • hedefX, hedefY
  • oyunBitti
Frame’ler arasında hatırlanması gerekenler.
Yerel: geçici hesap
  • Bu tıklamadaki mesafe
  • Döngü sayacı i
  • Bir çizimde kullanılan renk
İş bitince kimsenin ihtiyaç duymadıkları.
Kaydet ve yükleBir oyunu kaydetmek, global durumun bir dosyaya yazılmasıdır. Yerel değişkenler kaydedilmez; yüklenince yeniden hesaplanırlar.

Kendi cümlelerinizle

  1. Skor neden draw() içinde let ile tanımlanmamalı?
  2. Parametre adı global bir değişkenle aynı olursa ne olur?
  3. İç içe iki for döngüsünde ikisine de i demek neden sorun çıkarıyordu? Bunun bugünkü konuyla ilgisi ne?
  4. Her şeyi global yapsak ne kaybederiz?

Kod zamanı

  1. Bir can değişkeni tutun (başlangıç 3). canAzalt(miktar) fonksiyonu yazın; her tıklamada 1 azaltsın, ekranda gösterin.
  2. Parametrenin adını bilerek can yapın. Ne oldu? Neden?
  3. Global hiç kullanmadan çözün: yeniCan(eskiCan, miktar) yeni değeri döndürsün; çağıran can = yeniCan(can, 1); yazsın.
  4. İki çözümü karşılaştırın: hangisinde fonksiyon tek başına daha anlaşılır?

Konsola ne yazılır?

  1. 1
  2. 5
  3. 6
  4. Hata verir

Fonksiyonun içindeki let a yeni, yerel bir kutu açar ve globali gölgeler. Global a’ya hiç dokunulmaz.

Peki bu sefer?

  1. 1
  2. 5
  3. 6
  4. Hata verir

let yok; yeni kutu açılmıyor. Fonksiyon doğrudan global a’yı değiştiriyor. Tek bir sözcük bütün farkı yaratıyor.

Bu kod neden hata verir?

  1. text sayı yazamaz.
  2. i yalnızca for bloğunun içinde yaşar; dışarıda tanımsızdır.
  3. Döngü hiç bitmez.

let blok kapsamlıdır: süslü parantezin içinde tanımlanan, dışarıdan görünmez.

Merak edenler için kaynaklar

Patt ViraPass by Value vs Pass by ReferenceArgümanın parametreye kopyalanması; “kopya mı, kendisi mi?” sorusu.pattvira.com › intro-to-creative-coding › pass-by-value-vs-pass-by-reference javascript.infoVariableslet, const ve adlandırma üzerine ayrıntılı yazılı kaynak (İngilizce).javascript.info/variables
MDNletBlok kapsamının resmî tanımı ve örnekleri (İngilizce).developer.mozilla.org › JavaScript › Statements › let The Coding TrainParameters and ArgumentsParametrelerin yerel olduğunu örnekle gösteren video.thecodingtrain.com › 5-functions › 2-arguments

Bugün ne öğrendik?

  • Kapsam: bir adın geçerli olduğu bölge.
  • Global değişkenler en üstte tanımlanır; frame’ler arasında yaşar, her fonksiyondan görülür.
  • Yerel değişkenler ve parametreler fonksiyon bitince yok olur.
  • Argümanın değeri parametreye kopyalanır; parametreyi değiştirmek çağıranı etkilemez.
  • Aynı adlı yerel, globali gölgeler. Parametrelere ayırt edici adlar verin.

Sıradaki ders

Oyun ne kadar hızlı akıyor?

Oyun döngüsü, FPS ve frameRate.

Sonraki sunum →← Önceki