|
Buraya kadar her bir
Javascriptin nasıl olması gerektiğini öğrendiniz, nasıl yorumlar
koyabileceğinizi de öğrendiniz. Şimdilerde hiç bir işe yaramayan
"alert box" örneğini de gördünüz. Çok fazla bir şey değil, ama
meraklanmayın. Bundan sonra artık az laf çok iş. Direk dersimize
dalıyoruz. Şimdi derin bir nefes alın, hatta gidin kendinize bir
fincan çay, kahve yapın, mevsim meyvaları bile olabilir. Uyanık
ve ayık kalmaya gayret edin.
Bugün Javascriptin bilgiyi
nasıl sakladığını ve ondan nasıl " kod " yarattığını öğreneceğiz.
Merak etmeyin, bu bir bilim değil, sadece sabır işi. Yalnız bu
derste okuduklarınızın hepsini anlamanız gerekiyor. Burada
görecekleriniz daha sonraki derslerde ve ilerde kendi
programlarınızı yazarken lazım olacak şeyler.
Değişkenler
Matematikte
kullanıldığı gibi, değişkenler sayıları ve "string"leri
saklarlar. ( "string" terimi size şimdilik sıkıntı vermesin, daha
sonra anlatacağız.) Şöyle düşünebilirsiniz: Bir karenin alanını
hesaplamak istiyorsunuz. Genişliği "a", uzunluğu "b" olarak tarif
ediyorsunuz. Şimdi, eğer a=50 ve b=25 olursa, alanı 1250 cm2
olur. Size basit bir örnek:
<script
language="JavaScript">
<!--
// En, boy ve yüksekliği belirten değişkenler
var yuk = 50;
var en = 35;
var boy = 15;
// Alan ve hacimi hesaplayan denklemler
var alan = en * boy;
var hacim = alan * yuk;
// Sonuçların çıktısının alınması
document.writeln("Yüksekliği ");
document.writeln(yuk);
document.writeln("cm ve boyu "+ boy +"cm olan bir alanın
yüzölçümü "+ alan +"cm<sup>2</sup>");
document.writeln("Hacmi ise: "+ hacim +"cm<sup>3</sup>");
// -->
</script>
Yukarıda gördüğünüz bir sürü
değişik kod var, ne olduğunu ise az sonra adım adım öğreneceğiz.
<script language="JavaScript">
<!--
Eminim bu size bir yerden tanıdık geliyordur; Yok hiç
tanışmadık derseniz hemen Giriş sayfasına geri dönüp okuyun :-))
// En, boy ve yüksekliği belirten değişkenler
var yuk = 50;
var en = 35;
var boy = 15;
Gördüğünüz gibi ilk satır
sadece bir yorum, yorumda takip eden satırlarda nelerin yazılı
olduğunu belirtiyor, gerçek scriptin üzerinde hiç bir etkisi yok.
Yorum satırna "Cindy Crawford" yazsanız bile tarayıcı durup,
"Hani, Cindy Crawford neredeymiş?" diye aramaz (bir kısmımızın
bakacağı gibi). Dikkate almadan devam ederler (bu tarayıcı
programlarda gerçekten zevksiz şeyler, değil mi? :-)
Şimdi, bundan sonraki
satırlar bayağı enteresan. Değikenleri tarif ediyorlar.
Değişkenleri belirlerken takip etmeniz birkaç kuralı ise hemen
aşağıya sıraladık:
Değişkenler var diye
başlarlar.
Gerçekte bu şart değil ama kodu okumanızı kolaylaştırıyor.
İlla yeni bir değişken belirlerken var diye başlamaya mecbur
tutmuyorum, ama sanırım var diye başlamak bayağı iyi bir fikir.
Değişkenler küçük harfle
yazılmalı
JavaScriptler değişkenlerin küçük-büyük harfli olmasına ayrı
reaksiyon verirler. Genel kural, sadece küçük harfli değişkenler
kullanma şeklinde oluşmuştur. Dilerseniz hepsini büyük harf
yapabilirsiniz yada karışık kullanabilirsiniz, fakat kodlama
esnasında yapılabilecek hataların önüne geçmek için ve
sinirlerinizin selameti açısından gelin hepsini küçük harf yapın
gitsin -- böylece programcıların %99 ile uyum sağlamış olursunuz.
Değişkenler bir harf ile
başlamalıdır
Şimdi scriptin "!değişkeni"ni neden tanımadığını anladım.
Satırı noktalı virgül ile
sona erdirin
Dikkat ederseniz satır sonlarında birer tane " ; " var. Her
Javascript satırının sonuna mutlaka bir tane " ; " koyuverin. Bu
şekilde hataların önüne geçmiş olursunuz.
// Alan ve hacimi hesaplayan denklemler
var alan = en * boy;
var hacim = alan * yuk;
Biraz hesaplama. Javascript
bu satırları icra ettikten sonra "alan" değişkeni " en " (50) ve
" boy " (15) değişkenlerinin çarpımlarının sonucunu
bulunduracaktır. Artık Javascript bundan sonra nezaman bu
değişkeni görürse 50 ile 15 in çarpımı ile elde edilen sonuçla
yer değiştirtecektir. Aynısı ikinci satır için de geçerlidir.
Eveeet, değişkenler için bu
kadar yeter. Ama Javascriptle işimiz henüz bitmedi!.. Anlatmaya
bir sonraki bölümde devam ediyoruz.
Sayfalara
Yazdırmak:
// Sonuçların çıktısının alınması
document.writeln("Yüksekliği ");
document.writeln(yuk);
document.writeln("cm ve boyu "+ boy +"cm olan bir alanın
yüzölçümü "+ alan +"cm<sup>2</sup>");
document.writeln("Hacmi ise: "+ hacim +"cm<sup>3</sup>");
Burası Javascriptin enteresan
noktası. Önce değişkenleri yarattık yada değiştirdik, şimdi ise
web sayfasının kaynağına yazdırıyoruz, böylece insanlar uykusuz
gecelerinizin ürününü görme şansına kavuşuyorlar...:-)
Şimdi istesem "
document.writeln() " nedir, nedemektir, sonsuza kadar
yazabilirim, ama kısaca denilebilecek bir şey varsa, scriptin bu
kısmı, kesinlikle <BODY> ve </BODY> etiketleri arasında
bulunmalıdır, hatta sonucun sayfanızda yazılmasını istediğiniz
noktasında bulunmalıdır. Çünkü Javascript çalışmış, bir çıktı
üretmiş, artık tarayıcı program sizin belirleyeceğiniz noktaya
yazdıracaktır. "document.writeln()" için bu kadar yeter.
Unutmadan, eğer sayfanıza Javascriptinizle ilgili bir HTML
yazdırmak istiyorsanız, bu işi document.writeln() yapacaktır.
Şimdi ise document.writeln()
deki () parantezlere konsantre olmanızı istiyorum.
document.writeln("Yüksekliği
"); ilk satır
İlk satırdaki parantezlerin
içindeki çifttırnakları " " görüyormusunuz? İşte "" arasında ne
yazılı ise Javascript onu HTML olarak düşünür ve sayfanızın
kaynağına yazar. Örnekte ( " ) kullandım ama, dilerseniz siz ( '
) kullanabilirsiniz. Her ikiside birbirinin yerine
kullanılabilir.
document.writeln(yuk); İkinci satır
Şimdi
ise 2ci satıra iyi bakın: Hiç " " işareti yok. " " içine
alınmamış karakterler değişken olarak düşünülür. Dikkat ederseniz
yuk bizim daha önce belirttiğimiz bir değişken. Sanırım olan
biten biraz anlam kazanmaya başlamıştır. Javascript değişken olup
olmadığını kontrol eder, eğer değişken bulursa, onu değişkenin
değeri ile değiştirir.
document.writeln("cm ve boyu "+ boy +"cm olan bir alanın
yüzölçümü "+ alan +"cm2"); üçüncü satır
Sanırım 3cü satır içlerinde
en enteresan olanı olsa gerek. 1 ve 2ci satırların özelliklerini
bir arada bulundurmakta. + işareti kullanarak değişkenleri ve
stringleri bir arada kullanmakta. (Dilerseniz + işareti kullanıp
daha fazla değişkeni de işin içine katabilirsiniz) Gördüğünüz
gibi, herşey bir çift tırnak " ile başlıyor. Sonra bir kaç kelime
var. Tekrar bir çift tırnak işareti " ile sona eriyor. Bu
stringin bittiğinin işareti. Buradan sonra Javascript kapama
parantezi beklerken biz ona + işareti veriyoruz. Şu sırada
javascript herşeyi hiç " yokmuş gibi düşünüyor! Fırsattan
istifade ederek bizde parse edilecek değişkeni bildiriyoruz.
(parse'ın Türkçe karşılığı nedemek ise?) Böylece değişken doğru
rakamla değiştirilip devam edip gidiyor. Sonraki + ile Javascript
kodu gibi işlenecek kısmın bitişini bildiriyoruz. Artık sıra
yeniden " işareti ile HTML olarak yazılacak kısmın başladığını
söylüyoruz. Bu aynen bir daha tekrarlayıp ve bir çift tırnakla
son buluyor. Basit değil mi? :-)
En enteresan şeylerden biride
son iki satırdaki <sup> etiketi. <sup> etiketi bir karakteri
Superscript (yani üssü) şeklinde yazdırır. Ama merak etmeyin o
etiketin oraya konmasını sebebi, araya HTML kodu girebileceğinizi
göstermek içindi. Ama dikkat ettiyseniz, HTML etiketleri " "
içerisinde yer alıyor, dışında değil.
// -->
</script> |