Giriş  | |
|
|
|
 13 Ağustos 2008; 21:03:46
|
|
|
İyi günler arkadaşlar,
İnternette bulduğum kaynakları sizinle hiçbir değişikliğe uğratmadan burada paylaşacağım... Biliyorum belki bir çoğunuz bunları biliyorsunuz fakat foruma üye olan ve görüp de öğrenmek isteyen arkadaşlar olabilir. Onlar için faydalı olabileceğini düşünüyorum.
Aslında belli etmiyorum ama benim de pek bir bilgim yok, yani bu sayede hem bende öğrenicem hem başkalarıda faydalanıcak...
Şimdiden hayırlı olsun...
Anlatacağım içeriği Dr. Hakkı Öcal yazmıştır...
İçindekiler
- Önsöz
- Javascript’le Tanışalım
- Javascript’in Temel İlkeleri
- Javascript Yazım Kuralları
- Javascript Değişkenleri (Variable)
- Javascript’te İşlemler (Operator)
- Atama (Assignment) İşlemleri
- Aritmetik İşlemleri
- Karşılaştırma İşlemleri
- Alfanümerik İşlemleri
- Şartlı İşlemler
- Mantıksal İşlemler
- İşlemlerde Sıra
- Program Akış Denetimi
- If (Eğer .. ise)
- If ... Else (Eğer .. Diğer)
- Program Döngü Denetimi
- for döngüsü
- Şartlı döngü: while
- do...while
- Break ve Continue
- Switch
- Javascript’te Fonksiyon
- Fonksiyona değer gönderme ve değer alma
- Fonksiyon ile HTML unsarlarının ilişkisi
- Date(): getYear(), getMonth(), getDate(), getDay(), getTime(), getHours(), getMinutes(), getSeconds()
- toString(), toLowerCase(), toUpperCase()
- setTimeout("fonksiyonun_adı", milisaniye)
- Değişkenleri Değerlendirme (Eval)
- Javascript’in Nesneleri, Olayları ve Özellikleri
- Nesneler
- Olaylar
- onClick
- onSubmit
- onReset
- onChange
- onFocus, onBlur
- onMouseOver, onMouseOut
- onLoad, onUnLoad
- onError, onAbort
- Nesneler ve Olayları Birleştirelim
- Browser Nesneleri
- Pencere (window)
- Mesaj Kutuları
- Çerçeve Nesnesi
- Belge (Document) Nesneleri
- Form Nesneleri
- Formun unsurları
- Radyo Düğmesi (Radio)
- Select
- Password
- Gizli Nesneler (Hidden)
- Javascript Nesneleri
- Javascript ile Dinamik HTML
- Düğme Grafiği Animasyonu
- Katman Tekniği (DIV, LAYER)
- Sonuç
Kırmızı Yazılmış Menü İtemlerini Aşağıdaki Mesajlarımda Bulabilirsiniz.
< Bu mesaj bu kişi tarafından değiştirildi savaşım -- 15 Ağustos 2008; 21:29:02 >
_____________________________
Yorumlarınızı Bekliyorum!
|
|
|
|
|
|
13 Ağustos 2008; 21:06:21
|
|
|
ÖNSÖZ
Eskiden, medrese zamanı, o zamanki öğrenciler de bizden farklı olmayıp, dersi kaynatmak istedikleri zaman müderrise, "Hocam; hangi velinin kızını dağda kurt yedi?" diye sorarlarmış. Hoca da başlarmış anlatmaya: "Bir kere veli değil, nebi idi; dağda değil çölde idi; kızı değil, oğlu idi. Kurt demedi, ‘Yedi!’ dediler.." dermiş.
Son bir yıldır en sık karşılaştığım soru: "Web siteme veya filanca sayfama bir Java koydum; ama çalışmıyor! Bir bakar mısınız?" Müderrisin hesabı, bu soruyu baştan yanıtlasak iyi olacak:
Bir kere Java değil, Javascript. Çalışmıyor değil, sayfada bu Script’i çalıştıracak olay ya da komut yok! Ayrıca başka bir Web sayfasında çalışan bir programın zorla yamandığı her sayfada çalışması mümkün olamaz. İşin temizi şu işi baştan öğrenmek! Sonuç itibariyle Web siteniz varsa veya açmayı düşünecek kadar ilerlediyseniz, HTML’i öğrendiniz demektir. Javascript’in, programlama dili sayarsanız, HTML’den zor bir tarafı yok! Bütün mesele, işi yarım bırakmamak; iki satır komut öğrenip, eski usul, başkalarının Javascript metinlerini kesip-kesip yapıştırma yoluna gitmemek.
Bu kitapçığı elinize alıp, bilgisayarın karşısına geçip, çok değil, bir haftanızı verirseniz, "Javascript biliyorum!" diyecek kadar Javascript öğrenebilirsiniz. Gerçi Javascript’in temeli olan ECMAScript ile ilgili kurallar kitabı 1.500 sayfa ama! Varsın olsun. Niyetiniz Javascript ile yeni bir oyun programı yazmak değilse, bu kitapçıktaki bilgiler işinize yarayacak kadar bu dili öğrenmenizi sağlayacaktır.
Konuya girmeden bir iki noktaya açıklık kazandıralım. "Javascript, Java değildir," dedik. Peki nedir? Javascript, Netscape firması tarafından hep ürküntü ile duya geldiğimiz C dilinden türetilmiştir. Java ise, Sun firması tarafından Pascal ve Delphi dillerinden esinlenerek yazılmıştır. Javascript, HTML gibi, Visual Basic Scripting Edition (VBScript) gibi, kodları (komutları) düz yazı dosyası olarak kaydedilen ve işleyebilmesi için bir yorumlayıcıya ihtiyacı olan bir dildir. Java ile yazdığınız program ise (en azından teoride) işletme sisteminden bile bağımsız olarak, kendi başına çalışabilir.
Netscape, HTML’in dil olarak yetersizliğini Web Browser programının ikinci sürümüne hazırlanırken gördü. Bir kere bir Web sayfasına bir "iş yaptırmak" istediğiniz zaman bunu HTML ile yaptıramıyordunuz. Ayrıca HTML yeteri kadar dinamik değildi. Mesela, Web ziyaretçisi radyonuzun program listesinin yer aldığı sitenize bağlandığında kendisine programları güne göre sunmak istediğinizde, bir CGI programı yazmanız veya yazdırmanız gerekiyordu. CGI (Common Gateway Interface) Web ziyaretçinin Browser’ı ile sizin sitenizin bulunduğu Web Server’ın buluştuğu nokta. Bu noktada yapılacak işler, çalıştırılacak programlar Web Server’da çalışıyor demektir. Her yeni ziyaretçi, her yeni CGI programı Web Server’ınıza ek yük yüklenmesi, yani Web Server’ın giderek yavaşlaması demek. Siteleri dinamik hale getirmeyi amaçlayan ve Web sayfasının "eğer.. ise.." sorusunu sormasını gerektiren böyle küçük programları Server’da değil de, ziyaretçinin bilgisayarında çalıştırabilmek, Server’ın yükünü azaltabilirdi. Bu düşünceden yola çıkan Netscape, LiveScript adıyla bir "Düz yazı dili" geliştirdi. O sırada Sun firmasının geliştirdiği, PC veya Mac farkı gözetmeden, Windows, Unix veya başka bir işletim sistemine tabi olmadan çalışacak bir dil üzerinde çalışıyor, ve böyle bir dilin geliştirildiği haberleri bile bilgisayar programcıları arasında heyecan fırtınalarına sebep oluyordu. Ortalığı bir "Java" fırtınası kaplamıştı. Netscape, akıllıca bir davranışla 1995 Aralık’ında bu dili piyasaya Javascript adıyla sürdü. Netscape 2.0, "Javascript uyumlu" olarak çıktı. O sırada Microsoft da Internet Explorer adlı Browser’ına bu imkanı kazandırmak istiyordu, ama Netscape bir yıla yakın Javascript’i paylaşmaya yanaşmadı. Microsoft, Netscape’in Javascript yorumlama kodunu almadan, IE’i Javascript’i anlar hale getirdi; fakat ortaya çıkan dile JScript adını verdi. Jscript 1.0 ile Javascript 1.0 tümüyle aynı idi ve her iki program da hem Javascript, hem de JScript anlayabiliyordu. Fakat bu durum çok uzun sürmedi; her iki firma da kendi Script diline diğer programın tanımadığı özellikler kazandırdılar. Bu arada Microsoft, IE’ye, JScript’te de, Javascript’te de olmayan becerilerle donattığı VBScript’i tanıma özelliği kazandırdı.
Şu anda Netscape firmasının Netscape Navigator’ı üçüncü sürümüne varan JScript’i ve VBScript’i tanımıyor, yorumlayamıyor. Buna karşılık IE, her üç Script dilini (Javascript’in bazı komutları hariç) tanıyabilir, yorumlayabilir. VBSCript, günümüzde daha çok Microsoft’un Web Server programı olan Internet Information Server (IIS) ile çalışan Web Server’larda, Server için yazılan programlarda kullanılıyor. Bu tür programlarda, mesela Active Server Pages teknolojisi ile yazılacak Server uygulamalarında da Javascript kullanılabilmesi, Javascript dilini bir Web tasarımcısının öncelikle öğrenmesini gerekli kılıyor. Bunu gerekli kılan başka gelişme daha var. Avrupa Birliği standart kurumu, daha sonra kavgayı bir kenara bırakıp, Script dilinde ortaklığa gitmenin daha doğru olduğunu gören Microsoft ve Netscape firmalarının ortaklaşa sunduğu öneriye dayanarak. Javascript ve JScript’i ECMAScript adıyla birleştirecek bir standart yayınladı. Kısa bir süre sonra, Javascript’e yüzde 99 benzeyen ortak bir Script diline kavuşacağız. Bu dili çıktığı gün bilir olabilmek için bugünden Javascript öğrenmek gerekir.
Özetlersek:
- Javascript, HTML’in içine gömülür; gerçek Java programları veya programcıkları ise yani Java Applet’ler HTML içinde sadece zikredilir, HTML’in parçası olmazlar.
- Javascript Browser’a bağımlı olarak yorumlanır, yani Javascript’in bazı komutları Netscape’te başka, IE’de başka sonuç verebilir veya hiç sonuç vermeyebilir.
- Javascript ile, ortaya uzatması .EXE olan bir dosya çıkartmazsınız; Javascript kodları HTML’in içine, kendisini HTML’den ayırteden <SCRIPT>...</SCRIPT> etiketlerinin arasına gömülür (isterseniz, içinde Javascript kodları bulunan bölümü ayrı bir düzyazı dosyası ve adının uzatmasını da ".js" yaparak HTML sayfasına LINK edebilirsiniz). Javascript, bir Script dili olduğu için illa şu ya da bu kurala uygun yazılmaz; son derece esnek bir dildir. Javascript yorumlanan bir dildir: kendisi bir takım nesneler oluşturmaz; kendisini yorumlayacak çerçeveye programa (yani Netscape Navigator’ın veya Internet Explorer’ın nesnelerini kullanır. Bu, Javascript öğrenmenin asıl büyük bölümünün Browser programının ne gibi unsurları, bu unsurların ne gibi özellikleri olduğunu ve bu özelliklere hangi olay sırasında nasıl hitap edileceğini bilmek anlamına gelir.
- Son nokta, Javascript, ancak bir olay halinde işler: bu olay ziyaretçinin Browser programının bir iş yapması, bir işi bitirmesi veya ziyaretçinin bir yeri tıklaması ya da klavyesinde bir tuşa basması demektir.
Peki, Javascript’i tanıdığımıza göre, biraz da onunla neler yapabileceğinizden söz edelim. Gerçi su kitapçığa ilgi gösterdiğinize göre, Javascript’in kullanım alanlarına o kadar da yabancı olmadığınız anlaşılıyor; fakat kısaca "client-side application" (istemci-tarafındaki uygulama) programlarına değinmemiz gerekir. Yukarıda dedik ki, Javascript bir Web sayfasında oluşturulmak istenen bazı etkileri yerine getirecek işlerin Web Server’da değil, ziyaretçinin bilgisayarında yapılması maksadıyla geliştirildi. O halde Javascript programları Web ziyaretçisinin bilgisayarında çalışacaktır. HTML kodlarınızın arasına gömdüğünüz Javascript kodları, kendilerini harekete geçirecek işareti görünce, ne yapmaları gerekiyorsa, o işi yaparlar. Bu işler neler olabilir? Çok çerçeveli bir sayfada belirli çerçevelerin içeriğini belirleme işi Javascript ile yapılabilir. Ziyaretçilerinizden sayfalarınızda bazı formlar doldurmalarını istiyorsanız, bu formların kutularına yazılan bilgilerin, arzu ettiğiniz türden olup olmadığı Javascript ile anında denetlenebilir (Hayır; Javascript, kendiliğinden, sitenizi ziyaret edecek kişilerin kredi kartı numarasını edinemez!).
Javascript öğrendiniz diye her yere Javascript kodları serpiştirmeli misiniz? Hayır. HTML ile yapabileceğiniz bir işi asla Javascript ile yapmamalısınız. Bu iyi tasarım ilkelerine aykırıdır. Bir kere, sayfanıza koyacağınız her Javascript kodu, sizin kendi yükünüzü arttırır; belirttiğimiz gibi Javascript henüz ve muhtemelen epey bir zaman için Browser-bağımlı olarak kalacak, yani kodlarınızın IE ve Netscape’de yorumu daima yüzde 100 aynı olmayacaktır. Bu yüzden yazacağınız her Javascript kodunu her iki Browser’da ve farklı sürümlerinde sınamak zorundasınız. İkincisi, Javascript kodunuz, ne kadar kısa olursa olsun, ziyaretçinin Browser’ının yükünü arttıracaktır. Hiç kimsenin sizin programcılık becerisi gösterinizi izleyecek zamanı yok! Javascript veya başka herhangi bir Script programına, ancak ve sadece HTML’in yetersiz kaldığı durumlarda başvurabilirsiniz.
Sonuç: Javascript, Java değildir, ama ona yakın beceriklilikte bir programlama dilidir. Programlama dilleri arasında öğrenme kolaylığı bakımından en ön sırada yer alır. Ve en önemlisi, Javascript olağanüstü zevklidir. Gerçek hikayeyi anlattıkça, Javascript ile neler yapabileceğini gördükçe, bir daha başkasının Javascript kodunu alıp, "Neden işlemiyor?" diye üzülmektense, kendi Javascript’inizi yazmanın daha kolay olduğunu da göreceksiniz.
Bu kitapçığı, okurun iyi, hem de bayağı iyi düzeyde HTML bildiği varsayımıyla ve programlama konusunda hiç deneyimi olmayan bir Web tasarımcısını dikkate alarak kaleme aldık. Eğer HTML konusunda kendinizi hazır hissetmiyorsanız, söz gelimi, Byte dergisinin Eğitim Dizisi’nde çıkan HTML Rehberi kitapçığını okumanızı öneririm. Bir programlama dili biliyor ve şimdi Javascript‘i öğrenmek için bu kitapçığı okuyorsanız, programlamanın temel ilkeleriyle ilgili cümleleri veya bölümleri okumak zorunda değilsiniz! Yine bu kitapçıkta hemen her fırsatta Javascript’e ilişkin bütün terimlerin İngilizcesini göstermeye ve kullanmaya çalıştık. Bunun amacı, ilerde karşılacağınız kullanılmaya hazır ve kullanma izni verilmiş Javascript kodlarını kendi sayfalarınıza uyumlu hale getirirken, program yazıcısının neyi nasıl ifade ettiğine aşina olmanıza yardımdır. Bu kitapçıkla giriş yaptığınız Javascript’i daha başka kaynaklardan derinlemesine öğrenmek istediğiniz zaman da, İngilizce terimler kaynaklar arasında paralellik kurmanıza yardımcı olacaktır. Buraya kadar dersi iyi kaynattık. Haydi kolları sıvayalım.
Bu kitapçıktaki örnek kodları istediğiniz gibi kendi sitenizde kullanabilir ve dağıtabilirsiniz. Ancak bu kodların satılması yasaktır.
_____________________________
Yorumlarınızı Bekliyorum!
|
|
|
|
|
|
13 Ağustos 2008; 21:14:24
|
|
|
JAVASCRITP'LE TANIŞALIM
Javascript programı yazmak için ihtiyacınız olan alet-edavat, bu kitapçığın yanı sıra, iyi bir bilgisayar ve bir düz yazı programıdır. Bilgisayarınız ecza dolabı kılıklı bir PC ise Notepad, bilgisayarınız mandalina, çilek veya şeftali renkli bir iMac ise SimpleText bu iş için biçilmiş kaftan sayılır. Eğer bu amaçla bir kelime-işlem programı kullanacaksanız, oluşturacağınız metnin dosyasını diske veya diskete kaydederken, düz yazı biçiminde kaydetmesini sağlamalısınız. Çalışmaya başlamadan önce örnek kodlarınızı bir arada tutabilmek ve gerektiğinde gerçek sayfalarınızda yararlanabilmek için sabit diskinizde bir dizin açmanız yerinde olur.
Javascript, HTML’in bir parçasıdır ve içinde bulunduğu HTML ile birlikte Web Browser programı tarafından yorumlanır. Dolayısıyla, Javascript programı yazmak demek, bir Web sayfası hazırlamak ve bu sayfadaki HTML kodlarının arasına Javascript kodları gömmek demektir.
O halde, kolları sıvayıp, ilk Javascript programımızı yazalım. Şu kodu yazıp, merhaba1.htm adıyla kaydedin:
<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1254">
<TITLE>Merhaba Dünya!</TITLE>
</HEAD>
<BODY>
<B>Merhaba Dünya</B><br>
<FORM>
<BUTTON onclick="alert('Merhaba Dünya!')">TIKLAYINI!</BUTTON>
</FORM>
</BODY>
</HTML>
Sonra ya bu dosyayı iki kere tıklayın; ya da favori Browser programınızı çalıştırın ve bu dosyayı açın. Karşınıza çıkacak düğmeyi tıklayın. İşte sonuç:
Şimdi kendi kendinizi kutlayın: Birazcık yardımla da olsa, Javascript programcısı olarak dünyaya merhaba demiş bulunuyorsunuz. Yazdığınız koddan tek kelime bile anlamıyorsanız da hiç önemli değil. Önemli olan ilk adımı atmaktı.
Bu adımı attığınıza göre şimdi yazdığınız kodu biraz irdeleyelim. Bütün Web sayfaları gibi, Javascript kodunuzun yer aldığı sayfa da tipik bir HTML kod kümesi:
- Browser programına kendisinin bir HTML dosyası olduğunu birinci satırda beyan ediyor; ve bittiği yer açıkça gösteriliyor.
- HTML kodu iki bölüm içeriyor: Başlık (Head) ve gövde (Body) bölümleri. Her bölümün nerede başladığı ve nerede bittiği açıkça belirtiliyor.
- Gövde bölümünde bir Form unsuruna yer veriliyor; fakat bu formun tek ögesi var: Düğme (Button).
- Daha önce Web sayfalarınıza düğme koyduysanız, bu düğmenin onlardan farklı bir tarafı var: Türü, değeri, vs. belirtilmiyor; sadece "onclick="alert('Merhaba Dünya!')" şeklinde bir ifadeye yer veriliyor.
- Ve ilk Javascript programınızda ne Javascript’in adı geçiyor; ne de HTML ile Javascript bölümlerini birbirinden ayırteden, <SCRIPT>..</SCRIPT> etiketine yer veriliyor!
Özellikle bu son husus, size şunu gösteriyor: Günümüzde Netscape ve IE Javascript ile o kadar içiçe geçmiş ve Javascript özellikle 1.2’nci sürümü ile o kadar Browserların Belge Nesnesi Modeli (Document Object Model) ile kaynaşmıştır ki, kimi zaman HTML’in işlevi nerede bitiyor, Javascript’in işlevi nerede başlıyor, kolaylıkla ayırt edilemez. Javascript’ten söz ederken, bu dilin imla kuralları olmakla birlikte bu kurallara yüzde 100 uymanın zorunlu olmadığını ifade ettik. Kural olarak, Javascript bölümü, HTML’in içine <SCRIPT>..</SCRIPT> etiketlerinin arasına gömülür. İşte size bütün kuralları yerine getirilmiş bir Javascript bölümü yazma örneği:
<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 gizleyelim
function merhaba() //merhaba isimli fonksiyonu deklare ediyoruz
{ //bu, fonksiyonun başlama işareti
alert ("Merhaba Dünya!") //fonksiyonun komutu ve komutun gerektirdiği metin
} //bu fonksiyonun bitme işareti
// kod gizlemenin sonu -->
</HEAD>
<BODY>
<B>Merhaba Dünya</B><br>
<FORM>
<BUTTON onclick=merhaba()>TIKLAYINI!</BUTTON>
</FORM>
</BODY>
<HTML>
Bu metni merhaba2.htm adıyla kaydeder ve Browser’ınızda açarsanız, görüntünün ve işlevin tıpatıp aynı olduğunu göreceksiniz. İki metin arasındaki fark, ikincisinin Javascript yazma kurallarına yüzde 100 uymasından ibaret. Bununla birlikte Javascript ile HTML’i birbirinden dikkatlice ayırmanız gereken durumlar, ikisinin birbiriyle kaynaştığı noktalardan daha çoktur. Hatta o kadar ki, Javascript’in ileri sürümüne ilişkin komutlar kullanıyorsanız, eski sürüm Browser’ların kafasının karışmaması ve dolayısıyla ziyaretçinizin bilgisayarının kilitlenmemesi için bunu bile belirtmeniz gereken durumlar olabilir.
Bir de şunu deneyin: önce merhaba.js adıyla şu metni kaydedin:
function merhaba()
{
alert("Merhaba, Dünya!")
}
Sonra, merhaba2.htm dosyasında şu değişikliği yapın ve merhaba3.htm adıyla kaydedin:
<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1254">
<TITLE>Merhaba Dünya!</TITLE>
<SCRIPT SRC="merhaba.js" LANGUAGE="JavaScript">
</SCRIPT>
</HEAD>
<BODY>
<B>Merhaba Dünya</B><br>
<FORM>
<INPUT TYPE="SUBMIT" NAME="BUTTON1" VALUE="TIKLAYIN!" onclick="merhaba()">
</FORM>
</BODY>
</HTML>
Ve merhaba3.htm’i açtığınızda yine aynı görüntü ve aynı işlevle karşılaştığınızı göreceksiniz. Bu üçüncü yöntemde sadece Javascript kodlarını içeren ve dosya adının uzatması ".js" olan bir düzyazı dosyasını HTML’e dışardan da eklemiş olduk. Bu esnekliğe bakarak, Javascript diline, "Ne yapsam olur! Nasıl yazsam işler!" anlayışıyla yaklaşamazsınız. Javascript, bütün bilgisayar dilleri gibi yorumlanabilmesi (çalışabilmesi) için kendi imla ve dilbilgisi kurallarına son derece bağlı kalınmasını ister. Bunu sınamak isterseniz, şu ana kadar oluşturduğunuz herhangi bir HTML dosyasında Javascript bölümündeki bir parantezi veya süslü parantezi kaldırın; dosyayı başka bir isimle kaydedin ve Browser’ınıza açtırmaya çalışın! Merhaba3.htm dosyasında "onclick="merhaba()" komutunun bir parantezini kaldırdığımızda, Netscape ve IE’nin şu hata mesajlarını verdiğini görüyoruz:
HTML sayfalarınının Web Browser programlarında yapabileceği bir başka hata ise, kodu icra etmek yerine içerik gibi görüntülemektir. Web ziyaretçilerinin halâ kullandığı eski sürüm Browser programları, Javascript programlarını ya hiç anlamazlar, ya da eski sürümlerini anlarlar. Netscape 2.0 öncesi ile IE 3.0 öncesi Browser programlarının, Javascript kodlarını icra etmek yerine sayfanın içeriği imiş gibi görüntülemesini önlemek için Script bölümlerini eski sürüm Browser’lardan, merhaba2.htm sayfasında yaptığınız gibi gizlemeniz gerekir. Merhaba2.htm’e bakarsanız:
<!-- Javascript kodunu eski sürüm Browserlardan gizleyelim
function merhaba()
{
alert ("Merhaba Dünya!")
}
// kod gizlemenin sonu -->
şeklinde bir bölüm göreceksiniz. Bu bölümün başında ve sonunda yer alan "<!--" ve "-->" işaretlerinin arasındaki herşey, eski sürüm Browserlar tarafından HTML dili kurallarına göre "yorum" sayılacak ve görmezden gelinecektir. Javascript dilinin yorumları ise "//" işaretiyle başlar ve satır sonunda sona erer. Merhaba2.htm’de Javascript kodlarının bütün satırlarında böyle yorumlar koydunuz. Eğer yorumlarınız bir satırdan uzun olacaksa, bunu şöyle belirtebilirsiniz:
/* yorumun birinci satırı
yorumun ikinci satırı
yorumun üçüncü satırı */
Javascript veya başka bir dille program yazarken, iyi programcılar, programlarını kendilerinden başkası denetlemeyecek ve yeniden kullanmayacak da olsa, önemli işleri yaptıkları satırlara mutlaka yorum koyarlar. Bunun yararını, kendi yazdığınız bir programı bile bir yıl sonra yeniden açtığınızda görürsünüz!
Ziyaretçinin Web Browser programı Javascript anlıyor ise sayfanızdaki Javascript kodları, ya ilk yazdığınız programda olduğu gibi, ziyaretçinin sayfanızda bir yeri tıklaması veya klavyede bir tuşa basmasıyla harekete geçer; ya da HTML sayfası ziyaretçinin Browser’ında görüntülendiği anda otomatik olarak çalışmaya başlar. Otomatik çalışan Javascript kodu ise iki ayrı yöntemle çalıştırılabilir: HTML kodları icra edilmeden önce (yani sayfanız ziyaretçinin Web Browser’ında görüntülenmeden önce, veya sayfa görüntülendikten sonra. Davranın düz yazı programınıza ve şu kodları girin:
<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1254">
<TITLE>Merhaba Dünya!</TITLE>
<SCRIPT LANGUAGE="Javascript1.2">
<!--
alert("Merhaba Dünya!")
// -->
</SCRIPT>
</HEAD>
<BODY>
<B>Merhaba Dünya</B><br>
</BODY>
</HTML>
Bu dosyayı da merhaba4.htm adıyla kaydedin ve Browser’ınızda açın.
Sayfanızın içeriğini oluşturan "Merhaba Dünya" yazısı ile Javascript
programınızın icra ettirdiği uyarı kutusunun görüntülenmelerindeki
sıraya dikkat edin.
Bu dosyada, küçük bir değişiklik yapalım ve kodlarımıza şu şekli verelim:
<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1254">
<TITLE>Merhaba Dünya!</TITLE>
<SCRIPT LANGUAGE="Javascript1.2">
<!--
function merhaba()
{
alert("Merhaba Dünya!")
}
// -->
</SCRIPT>
</HEAD>
<BODY onLoad="merhaba()">
<B>Merhaba Dünya</B><br>
</BODY>
</HTML>
merhaba5.htm adıyla kaydedeceğiniz bu dosyayı Browser’ınızda açtığınızda, sayfa metni ile uyarı kutusunun görüntülenme sırasına dikkat edin. Merhaba4’de önce uyarı kutusunun görüntülenmesinin sebebi, Browser’ın HTML kodundaki komutları yukarıdan aşağı sırayla yerine getirmesi ve bu arada karşısına çıkan Javascript komutunu da icra etmesidir. Oysa merhaba5’te, Javascript komutunu bir fonksiyon olarak tanımladınız ve bu fonksiyonun icrasını HTML’in BODY etiketinin içeriğinin Browser’ın penceresine yüklenmesine bağladınız. Bunu Javascript’in "onLoad" komutuyla yaptık. (onLoad’ın nasıl kullanıldığını ve nerelerde kullanıldığını daha sonra ayrıntılı ele alacağız. Şimdiden telaşa kapılmaya gerek yok!)
Buraya kadar gördüğümüz bir kaç örneği, Javascript kodlarının ne zaman ve nasıl işlediğini göstermek amacıyla verdik. Fakat bu örneklerden çıkartacağımız başka bir sonuç daha var: Dikkat etti iseniz Javascript komutları, daima HTML sayfasının bir unsuruna bağlı olarak veriliyor. Yani Javascript’in konusu veya hedefi, Web Browser programının (Netscape veya IE’nin) bilgisayarın ekranında oluşturduğu pencerenin içindeki belgenin bir ögesi. Bu öge, şimdilik ya bu belgenin içindeki FORM unsurunun bir bölümü (örneğin, düğmesi), ya da sayfanın BODY bölümünün bizzat kendisi oldu.
Bu ögeler, unsurlar, unsurların bölümlerine programcılık dilinde "Nesne" (Object) denir. Ya kendisi bir nesne oluşturabilen veya içinde çalıştığı programın ya da işletim sisteminin nesnelerini konu alan ve bu nesnenin unsurlarını, ögelerini, parçalarını hedef olarak alan dillere Object-oriented (nesne-yönelimli) diller denir. Bu dillerle yazılan programlara (isterse bir Script dilinin düz yazı şeklindeki komutları olsun) Object-oriented Program (OOP) adı verilir.
Javascript programları da OPP sınıfına girdiği için, Javascript programcısı olacaksanız, programlarınızın mutlaka Web Browser’ın bir nesnesinin bir özelliğini belirlemeye veya değiştirmeye ve Web Browser’ı bir nesne oluşturmaya ve nesnenin şu özelliğini şöyle veya böyle yapmaya yönelik olması gerektiğini akıldan hiç çıkartmamalısınız. Bu nesne, Browser’ın penceresinin menü çubuğunun olması ya da olmaması, pencerenin bilgisayar ekranında ne büyüklükte olması, pencerenin alt çerçevesindeki statü mesajının içeriğinin değiştirilmesi bile olabilir. Javascript programı açısından HTML etiketleri ile oluşturacağınız hemen herşey nesnedir. Bu nesnelerin nasıl etkileneceği ise Javascript programının içeriğini oluşturur. Özetlersek, Javascript ile Web Browser programını penceresini ve Browser programının yorumladığı HTML etiketlerinin oluşturacağı sayfa ögelerini, bu ögelerin biçimini, değerini belirler, sorgulayabilir ve değiştirebilirsiniz.
Şimdi kısaca bu işlevselliğin temeli olan ve adına Document Object Model (DOM, Belge Nesne Modeli) denen kurallar demetinden söz edelim. Javascript kodu, DOM’u hedef alır: bu bağlamda DOM, bir Browser’ın penceresi ve penceresinin içindeki herşey demektir. Ama henüz herşey için bir olay ve metod standardı geliştirilmiş değil.
"Olay" (Event) ve "Metod" (Method) burada dikkat etmeniz gereken iki kelime. Olay, Web Browser’ın veya kullanıcının yaptığı bir iş, eylem, hareket demektir; "Metod" ise programcı olarak sizin bu "Olay"ı veya nesnenin bir özelliğini (Property) kullanarak, Belge’nin bir unsuruna yaptırtabileceğiniz iş, eylem, hareket veya değişikliktir. Bu "teori" ilk bakışta sanıldığı kadar kavranması zor değil. Bir örnekle açıklayalım:
Diyelim ki, HTML sayfanızda şöyle bir bölüm var:
<FORM NAME=form01> WEB KİTAPÇISI
<INPUT TYPE="checkbox" NAME="roman">Roman
<INPUT TYPE="checkbox" NAME="hikaye">Hikaye
<INPUT TYPE="checkbox" NAME="biyografi">Biyografi
<TEXTAREA NAME="sonuc" ROWS="6" COLS="6">Burada sonuç gösterilecek</TEXTAREA>
</FORM>
Şimdi bu HTML kodu sayfanızda şu Nesne’leri oluşturur:
- Bir adet Form
- Dört adet "checkbox" türü INPUT alanı
- Bir adet metin alanı
Şimdi dikkat: Sizin açınızdan "form01" isimli bu formu oluşturan FORM ögesi, Javascript açısından "document.form01" adlı nesnedir. Ziyaretçinin içine işaret koyduğu kutu, Javascript tarafından "document.checkboxSelected" diye tanınır. Sizin "sonuc" isimli metin alanınızın içinde yazılı olacak metin ise Javascript bakımından "document.form01.sonuc.value" (value=değer) diye bilinir. HTML dilini geliştirenler, türü "checkbox" olan INPUT nesnesinin başına gelebilecek "olay" türlerinin neler olabileceğini düşünürken, "Mesela," demişler, "Kullanıcı bu kutuyu tıklayabilir!" Yani, bu nesnenin Browser açısından yol açabileceği "olay"lardan biri tıklanması halinde olan olaydır. Tıklamanın İngilizcesi ne? "click!" O halde bu olayın adı "Click," bu olayı yönlenrdiren metodun adı ise "onClick"tir (on, İngilizce -de, -da eki veya üzerinde, halinde kelimesinin karşılığıdır). Bu durumda "onClick," olayı, bu kutu açısından bir olaydır ve Javascript prnogramcısı olarak bu olayı yakalayabilir, kullanabiliriz. Başka bir deyişle, Browser’a, Javascript yoluyla "Ey Browser; kullanıcı benim INPUT nesnelerimden "roman" adlı olanı tıkladığı zaman şu, şu işi yap!" emrini verebiliriz. Bu noktada bilgisayar programının, hangi dille yazılırsa yazılsın, alt alta gelmiş komutlar listesi olduğunu hatırlatalım.
Peki, yine aynı örnekte, Browser’a Javascript yoluyla ne gibi bir iş yaptırtabiliriz? Mesela, "Ey Browser, kullanıcı benim INPUT nesnelerimden ‘roman’ adlı olanı tıkladığı zaman benim ’sonuc’ adlı TEXTAREA nesnemin değerini ‘Roman’ yap!" diyebiliriz. Biliyorsunuz ki, TEXTAREA nesnelerinin değeri, ekranda çizdikleri kutunun içine koydukları içerik demektir. Tabiî aynı mantıkla, "hikaye" kutusu işaretlenince Sonuç kutusuna "Hikaye," "biyografi" kutusu işaretlenince de Sonuç kutusuna "Biyografi" yazdırtmak elimizde.
Kısaca, Javascript herşeyi, bir HTML ögesine göre tanımlar, adlandırır ve bilir. Unutmayacağınız kural: "Javascript, sayfanın bir şeyini alır, sayfanın bir şeyine hitabeder!"
Bu gayet anlamlı şekilde ifade ettiğimiz kuralı yerine getirmekte sorun, sadece Javascript’in on-onbeş kelimesini, yedi-sekiz işlemini öğrenmek değil, aslında HTML belgesinin nesnelerinin olaylarını ve metodlarını öğrenmektir.
Dolayısıyla, önce Javascript’in on-onbeş kelimesi ve yedi-sekiz işleminden ibaret temel kurallarını ele alacağız; sonra da bunlarla Belge Nesneleri'ne hangi olay halinde ne yapabileceğimizi ve bunu nasıl yapabileceğimizi göreceğiz.
< Bu mesaj bu kişi tarafından değiştirildi savaşım -- 13 Ağustos 2008; 21:23:32 >
_____________________________
Yorumlarınızı Bekliyorum!
|
|
|
|
|
|
13 Ağustos 2008; 21:16:25
|
|
|
JAVASCRIPT'IN TEMEL İLKELERİ
Web Browser programları, Javascript komutlarını yorumlayabilmek için, HTML’in içinde <SCRIPT LANGUAGE="Javascript"> etiketini ararlar ve </SCRIPT> etiketini gördükleri anda bu yoruma son verir; HTML yorumuna dönerler. Bu etikette, kullanacağınız Javascript sürümünü de belirtebilirsiniz. Javascript, şu anda 1.3’ncü sürümünde. Ancak Netscape 2.0 ve 2.2 ile IE 3.0, Javascript’in 1.0 ve 1.1 sürümlerini tanıyabilir. Her iki Browser’ın 4’ncü sürümleri ise Javascript 1.2 ile uyumludur. Script etiketinde sürüm yazmazsanız, her iki Browser da 1.0 sürümünü kullandığınızı varsayar. Netscape ileri sürümlere ait komutları (eğer tanıyorsa) icra eder, tanımıyorsa görmezden gelir. IE ise belirttiğiniz sürümden ileri komutları tanımaz ve hata mesajı verir. Kullanılan Browser türleri ve sürümlerine ilişkin istatistikler dikkate alınırsa, bu satırları kaleme aldığımızda en güvenli sürüm 1.2’dir. Biz de örneklerimizde bunu belirteceğiz. Hemen bir uyarı Javascript’in birinci sürümünü kastetmek amacıyla <SCRIPT LANGUAGE="Javascript1.0"> veya "<SCRIPT LANGUAGE="Javascript1"> yazmayın; IE hata mesajı verir, Netscape ise Javascript bölümünü görmezden gelir!
< Bu mesaj bu kişi tarafından değiştirildi savaşım -- 13 Ağustos 2008; 21:24:09 >
_____________________________
Yorumlarınızı Bekliyorum!
|
|
|
|
|
|
13 Ağustos 2008; 21:24:35
|
|
|
JAVASCRIPT YAZIM KURALLARI
Browser’ların Javascript yorumlama bölümleri, kodların arasında yer alan yorum ifadeleri ile boşlukları atar; geri kalan kelimeleri beşe ayırarak ele alırlar:
- Belirleyiciler (Identifier):
Javascript dilinin değişkenleri, metodları ve nesnelerini belirleyen isimlere Belirleyiciler denir. Bu sınıfa giren bütün kelimeler ya harfle ya da alt çizgi (_) ile başlar. Rakam veya diğer işaretler birinci karakter olarak kullanılamaz, fakat daha sonra kullanılabilir. Javascript, aynı kelimenin büyük harfle yazılanı ile küçük harfle yazılanını farklı isimler olarak görür. Bu sınıfta giren kelimelerin içinde boşluk olamaz. Javascript kodlarınız sizin bilgisayarınızda değil, ziyaretçinin bilgisayarında çalıştırılacağına göre, kullandığınız karakterlerin ziyaretçinin bilgisayarında nasıl bir değer taşıyacağını düşünmeniz gerekir. Bu bakımdan güvenli yol, Bu sınıfa giren kelimelerde, İngilizce alfabede bulunmayan, Türkçe ve diğer dillerdeki high-ASCII karakterleri (ı, İ, ğ, Ğ, Ş, Ş ile ü, Ü, ö, Ö, ç ve Ç) kullanmamaktır.
Aşağıda doğru ve yanlış belirleyici kelime örneklerini bulacaksınız:
Doğru Yanlış
sonucgoster sonuc goster
ikincidegisken 2ncidegisken
_gelen #gelen
Anahtar kelime grubundaki kelimeler de bu sınıfta kullanılamaz.
- Anahtar Kelimeler (Keyword):
Javascript dilinin önceden tanımlanmış ve programın yorumunda özel anlam kazandırılmış kelimelerine Anahtar Kelime denilir. Aşağıda bu kelimelerin yanında kelime anlamlarını göreceksiniz; fakat ilerledikçe bu kelimelerin Javascript’te kullanıldıkları yere göre anlamlarını ve nerelerde kullanıldıklarını göreceğiz.
Javascript 1.0’deki anahtar kelimeler:
break (kes)
continue (devam et)
else (başka bir durum)
false (yanlış)
for (için)
function (işlev)
if (eğer)
in (içinde)
int (integer, tam sayı)
new (yeni)
null (boş değer)
return (dön)
this (bu)
true (doğru)
var (variable, değişken)
while (... iken)
with (ile)
Javascript 1.i ile eklenen anahtar kelimeler:
typeof (türü)
void (geçersiz)
Javascript 1.2 ile eklenen anahtar kelimeler:
do (yap)
labeled (etiketli)
switch (değiştir)
- Ayrılmış Kelimeler (Reserved):
İkinci gruba girsin-girmesin bazı kelimeler, ilerde Javascript programlama ve yorumlama işlerinde kullanılabileceği düşüncesi ile, bir kenara ayrılmıştır; Javascript kodlarında kullanılamazlar. Bu listede yer alan ve halen Anahtar Kelime listesine girmiş bir kelime değişken, fonksiyon, nesne veya metod adı olarak kullanılırsa, program hata verir; henüz anahtar kelime listesine alınmamış olmakla birlikte "rezerv edilmiş" bu kelimelerin geçtiği komut satırı ise görmezden gelinir. Javascript programlarınızda kullanmayacağınız kelimelerin listesi şöyledir:
abstract (soyut)
boolean (Boolean Mantığı)
break (kes)
byte (bayt)
case (hal)
catch (yakala)
char (karakter)
class (sınıf)
const (sabit)
continue (devam)
default (varsayılan)
delete (sil)
do (yap)
double (çift)
else (başka bir durum)
extends (uzanır)
false (yanlış)
final (sonuncu)
finally (sonunda)
float (kesirli)
for (için)
function (işlev)
goto (--ya git)
if (eğer)
implements (uygular)
import (ithal et)
in (içinde)
instanceof (--nın oluşumu)
int (integer, tam sayı)
interface (arayüz)
labed (etiketli)
long (uzun)
native (kendinden olan)
new (yeni)
null (boş değer)
package (paket)
private (özel)
protected (korunmuş)
public (genel)
return (dön)
short (kısa)
static (sabit)
super (kuvvet)
switch (değiştir)
synchronized (uyumlu)
this (bu)
throw (içine kat)
throws (içine katar)
transient (geçici)
true (doğru)
try (dene)
typeof (türü)
var (değişken)
void (geçersiz)
while (iken)
with (ile)
- Değerler (Literal):
Javascript kodu icra edildiği sırada değişmeyen rakam veya metinlere Değer denir. Javascript kodlarında beş tür değer bulunur:
< Bu mesaj bu kişi tarafından değiştirildi savaşım -- 13 Ağustos 2008; 21:24:34 >
_____________________________
Yorumlarınızı Bekliyorum!
|
|
|
|
|
|
13 Ağustos 2008; 21:34:48
|
|
|
JAVASCRIPT DEĞİŞ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:
- 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.
- 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.
- 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!
- İş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!
- 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
| | | |
Basılabilir versiyon
