Javascript Değişkenler (Variable)

Değişken, adı üstünde, Javascript yorumlayıcısı tarafından bilgisayarın belleğinde tutulan ve içerdiği değer programın akışına göre değişen bir unsurdur. Değişkenlerin bir adı olur, bir de değeri. Program boyunca beğişkenin adı değişmez; fakat içeriği değişebilir.

Değişkenlere isim verirken Belirleyici isimleri kurallarına riayet etmeniz gerekir. Yani bir değişkenin adı rakamla veya alt çizgi (_) dışında

bir işaretle başlayamaz. Javascript, büyük harf-küçük harf ayırt ettiği (case-sensitive olduğu) için, örneğin SONUC ve sonuc kelimeleri iki ayrı değişken gösterir. Bir değişkeni tanımlarken, büyük harf kullandıysanız, program boyunca bu değişkeni büyük harle yazmanız gerekir.

Değişken tanımlamak, bilgisayar programcılarına daima gereksiz bir yük gibi görünür. Birazdan göreceğiz, Javascript sadece değişkenleri tanımlamayı zorunlu kılmakla kalmaz, fakat nerede tanımlandığına da özel bir önem verir. Javascript?e bir Belirleyici?nin değişken olarak kullanılacağını bildirmek için “var” anahtar-kelimesini kullanırsınız:

var sonuc
var adi, soyadi, adres, siraNo
var i, j, k
var mouseNerede, kutuBos, kutuDolu

Gördüğünüz gibi, bir “var” satırında birden fazla değişken tanımlayabilirsiniz. Bazı diğer programlardan farklı olarak Javascript, size değişkenleri hem beyan, hem de içeriğini belirleme işini aynı anda yapma imkanı veriyor (initialization):

var sonuc = "Merhaba Dünya!"
var adi = "Abdullah", soyadi = "Aksak"
var i = 100, j = 0.01, k = 135
var kutuBos = false, kutuDolu = true
Gerekiyorsa, bir değişkeni önce tanımlar, sonra değerini belirleyebilirsiniz:
var kutuBos = false, kutuDolu
kutuDolu = true

Javascript, programcıya bir değişkeni tanımlamadan “initalize etme” (içine doldurma) imkanı da verir; bu durumda o değişken genel (global) nitelik kazanır. Buna birazdan değineceğiz; ama iyi programlama tekniği ve özellikle daha sonra hata arama zorunluğu sebebiyle, değişkenlerin açık-seçik tanımlanması en doğru yoldur. Bir değişkeni tanımlayarak içini doldurmadan (initialization?dan) önce içindeki değeri sorgulamaya kalkarsanız, Browser?ın Javascript yorumlayıcısı o noktada durur ve tanımlanmamamış (undefined) değişken hatası verir. Javascript programlarında beş tür değişken bulunabilir:

1. Sayı (number): -14, 78, 87678

Sayı türündeki değişkenler, tam sayı, ondalık sayı, pozitif sayı veya negatif sayı olabilir. Sayı değişkenlerle aritmetik işlemler yapılabilir.

var eni = 9, boyu = 4
var alani = eni * boyu
document.writeln(alani)

Bu kod örneği ile Javascript, Browser penceresi içindeki belgeye “alani” adlı değişkenin değerini (36) yazdıracaktır.

2. Boolean değişken: true, false

Javascript, tanımlanırken değeri “true” (doğru) veya “false” (yanlış) olarak belirtilen değişkenleri otomatik olarak Boolean değişken olarak sınıflandırır ve sorguladığınızda “true” için 1, “false” için 0 değerini verir.

3. Alfanümerik (String) Değişken: “Merhaba Dünya!”

Alfanümerik değişken, kendisine tek veya çift tırnak içinde verilen bütün karakterleri tutar, ve sorulduğunda aynen bildirir. Alfanümerik değişkenin içi boş olabilir (var adi = “”, soyadi = “”). Alfanümerik değişkenler, tabir yerinde ise “toplandığında” değişkenlerin değerleri sırayla birbirine eklenir:

var adi = "Osman", soyadi = "Hömek"
var adisoyadi = adi + soyadi
document.writeln(adisoyadi)

Bu kod örneği ile Javascript, Browser penceresi içindeki belgeye “adisoyadi” adlı değişkenin değerini (OsmanHomek) yazdıracaktır. Araya boşluk koymanın tekniğine ilerde değineceğiz!

4. İşlev (Function) Değişken:

Javascript?in hayatî noktası fonksiyonlardır. Javascript?e fonksiyonlarla iş yaptırırız. Kimi fonksiyonu, Javascript?i tasarlayanlar bizim için tanımlamışlardır; bunlara metod denir. (Kimi metod, ne yapacaksa bizim hiç bir katkımızı beklemeden yapar; kimi metod mutlaka bizden bir katkı bekler.) Kimi fonksiyonları biz tanımlarız ve komutlarını biz veririz. Bunlara “Programlanan Fonksiyonlar” denir. Başlarda yazdığınız ve merhaba2.htm adıyla kaydettiğiniz dosyada biz “merhaba()” adlı bir fonksiyon oluşturduk; sonra bu fonksiyona bir otomatik fonksiyon olan alert() metodunu kullanmasını bildirdik; bu otomatik fonksiyona da görevini yaparken kullanmasını istediğimiz değeri verdik!

5. Nesne (Object) değişkenleri: window, document

Bu tür değişkenlere değişken adını vermek bile gerekmez; çünkü bunlar Browser?ın nesneleridir. Fakat Javascript kodlarımızda bu nesneleri de değişken gibi kullanabiliriz. Bu sınıfa giren özel bir değişken ise değerini “null” (içi boş) kelimesiyle belirlediğiniz değişkenlerdir.

Javascript, değişkenlerini bu beş sınıfa ayırmakla birlikte sizden değişkenlerinizini sınıflamanızı beklemez. Sınıflamanın önemi, daha sonra, programın ileri bir aşamasında bir değişkenin değeri ile yaptıracağınız işlemde ortaya çıkacaktır. Bir değişken, kendi sınıfının yapamayacağı bir işleme veya sorgulamaya tabi tutulursa, Javascript size pek de kibarca olmayan bir hata mesajı ile değişkeni doğru kullanmadığınızı hatırlatacaktır. Bununla birlikte bir fonksiyonda sayı olarak tanımlanmış ve doldurulmuş bir değişken, aynı fonksiyonda daha sonraki bir işlemde veya başka bir fonksiyonda alfanümerik değişken olarak tanımlanabilir ve doldurulabilir. Bu değişken sorgulandığında değerini, yetki alanı (scope) çerçevesinde bildirir.

Değişkenlerin yetki alanı veya geçerli olduğu alan (scope), oluşturulmuş ve değeri belirlenmiş olduğu sahayı, yani kendisine atıfta bulunulduğu zaman bildireceği değerini ve bu değişkene nerelerden atıfta bulunulabileceğini gösterir. Şimdi, HTML dosyasının baş tarafında (HEAD etiketi içinde) bir değişkeni tanımladığınızı ve ona bir değer verdiğinizi düşünün. Daha sonra yazacağınız bütün fonksiyonlarda veya değerini belirleyebileceğiniz otomatik fonksiyonlarda (metod?larda) bu değişkeni bir daha tanımlamaya ve değerini belirlemeye gerek kalmadan kullanabilirsiniz; çünkü Javascript açısından bu değişken genel (global) değişken sayılır. Daha sonra ayrıntılı olarak göreceğimiz gibi, HTML?in gövde kısmında (BODY etiketi içinde) bir fonksiyon yazdığımızı ve bu fonksiyonun içinde bir değişken tanımladığımızı düşünün. Daha sonra yazacağınız bir fonksiyonda bu değişkeni kullanamazsınız; çünkü Javascript bir fonksiyonun içindeki değişkeni yerel (local) değişken sayar ve kendi yetki alanı (scope?u) dışında kullanmanıza izin vermez. Bir yerel değişken, ait olduğu fonksiyon çağrıldığı anda oluşturulur ve fonksiyonun icrası bittiği anda yok edilir. Dolayısıyla bir fonksiyon, başka bir fonksiyonun yerel değişkinini kullanmaya kalktığında “undefined” (tanımlanmamış) değişken hatasıyla karşılaşırsınız.

Bir değişkeni bütün HTML sayfası boyunca kullanmayı düşünüyorsanız, bu değişkeni, HTML sayfasının başında içinde fonksiyon bulunmayan bir SCRIPT bölümünde tanımlamalı ve doldurmalısınız. İyi bir programlama tekniği, genel değişkenleri, açık-seçik tanımlamak ve bunu yorum satırıyla belirtmektir:

<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1254">
<TITLE>Merhaba Dünya!</TITLE>
<SCRIPT LANGUAGE="Javascript1.2">
<!-- Javascript kodunu eski sürüm Browserlardan saklayalim
// genel değişken tanımları
var metin1 = "Merhaba Dünya!"
var metin2 = "Vayy, merhaba canım! N?aber?"
var metin3 = "Bu samimiyet nereden? Lütfen biraz ciddi olur musunuz?"
// -->
</SCRIPT>
</HEAD>
<P>BURAYA ÇEŞİTLİ AMAÇLARLA HTML KODLARI GİREBİLİR!! SONRA TEKRAR SIRA JAVASCRIPT'E GELEBİLİR</P>
<SCRIPT LANGUAGE="Javascript1.2">
<!-- Javascript kodunu eski sürüm Browserlardan saklayalim
//bu fonksiyon uyarı kutusu açar
function merhaba()
{
alert(metin1)
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<B>Merhaba Dünya</B><br>
<FORM>
<INPUT TYPE="SUBMIT" NAME="dugme1" VALUE="TIKLAYIN!" onclick="merhaba()">
</FORM>
</BODY>
</HTML>

Bu kodu da merhaba6.htm adıyla kaydedebilirsiniz. Daha sonra merhaba fonksiyonunda “alert(metin1)” satırındaki 1 rakamını 2 ve 3 diye değiştirirseniz, merhaba6.htm?in uyarı kutusunun içeriğini değiştirdiğini göreceksiniz. Şimdi, merhaba6?da merhaba() fonksiyonunu şöyle değiştirin ve şu eki yapın:

function merhaba()
{
var metin1 = "Sana da merhaba!"
alert(metin1)
}
function hello()
{
alert(metin1)
}

Sonra, aynı dosyada mevcut düğme oluşturan INPUT satırının altına şu satırı ekleyin; sayfanızda iki düğme görünecektir:

<INPUT TYPE="SUBMIT" NAME="dugme2" VALUE="TIKLAYIN!" onclick="hello()">

Bu düğmelerden birincisi, merhaba() fonksiyonunu, ikincisi hello() fonksiyonunu çağıracak. Genel olarak tanımladığınız ve değer verdiğiniz metin1 değişkeninin değerini merhaba() fonksiyonunda değiştirdiniz; bu değişkenin yeni değeri “Sana da merhaba!” şeklini aldı. Bu metni, merhaba7.htm adıyla kaydedip, Browser?da açtığınızda ve birinci düğmeyi tıkladığınızda, uyarı kutusunun içeriğinin metin1 değişkeninin genel değerini değil yerel değerini içerdiğini göreceksiniz. Yani metin1?in değeri değişmiş oldu. Peki, ikinci düğmeyi tıklayın! metin1?in değeri değişmemiş gibi, uyarı kutusunun genel tanımlamadaki değeri kullandığını göreceksiniz. Oysa biraz önce, birinci düğmeyi tıkladığımızda yani merhaba() fonksiyonu çalıştığında metin1?in değeri değişmemiş miydi? Şimdi neden eski metin1?in eski değeri karşımıza çıkıyor?

Bu alıştırmanın öğrettiği kural şöyle özetlenebilir: Bir genel değişken, bir fonksiyon içinde yerel olarak değiştirilebilir; ama onun genel değeri diğer fonksiyonlar için geçerli kalır. Javascript programlarınızı yazdığınız zaman genel değişkenleriniz beklediğiniz değeri vermiyorsa bu değeri bir fonksiyonun yerel olarak, sırf kendisi için, değiştirip değiştirmediğine bakmalısınız. Bu tür hatalardan kaçınmanın bir yolu, yerel değişkenlerinizle genel değişkenlerinize farklı isimler vermektir.

Javascript, değişkenlerinizi isimlendirmede rakamla ve işaretle başlamamak dışında kural koymuyor; ama iyi programcılık tekniği, değişkenlere anlaşılır ve kullanıldığı yeni belli eden isimler vermektir. Örneğin, “adi” şeklindeki bir değişken adı, çok değişkenli bir Javascript programında yanıltıcı olur. “musteri_adi” veya “musteriAdi” çok daha uygun olabilir. Ayrıca değeri “Evet” (=doğru, true) veya “Hayır” (=yanlış, false) olan Boolean değişkenlerin adlandırılmasında, örneğin, “doluMu,” “tamamMi,” “acikMi,” “bittiMi” gibi cevabı çağrıştıran değişken adları kullanabilirsiniz.

Bana Ders Anlat © 2008-2022