İçindekilerGirişİndex
YukarıİlkÖncekiSonraki YokSon
Geriİleri
Yazdır

FONKSİYON İLE HTML UNSURLARININ İLİŞKİSİ

FONKSİYON İLE HTML UNSURLARININ İLİŞKİSİ

Javascript açısından, yukarıdaki gibi uzun fonksiyon ile tek satırlık bir metod'un farkı yoktur: ikisi de kendisinden beklenen bir değeri, bu değeri bekleyen işleme teslim etmek zorundadır. Bunu ister 150 satırlık komut kümesiyle yapsınlar, isterse tek satırlık bir komutla, Javascript, isteyen bütün fonksiyonlara ve metodlara kendi nesnelerini ve onların metodlarını kullanma imkanı verir; hatta bilgisayarın kaynaklarından yararlanmalarını bile sağlar.

Böylece Javascript açısından Browser ve onun görüntülediği HTML belgesinin nesne olarak özelliklerine ve bilgisayarın kaynaklarını kullanmaya biraz daha yaklaşmış oluyoruz.

Şimdi yeni bir fonksiyon yazarak, Browser'ın, bilgisayarın işletim sisteminden saat ve tarih bilgisi edinerek, Javascript'e ulaştırmasını sağlayalım. Bunun için düz yazı programınızda şu kodu yazın ve fonksiyon2.htm adıyla kaydedin.

Göster Gizle Kopar Satır Gizle Satır Göster
  1 <HTML>
  2 <HEAD>
  3 	<meta http-equiv="Content-Type" content="text/html; charset=windows-1254">
  4 	<TITLE>Javascript'te Fonksiyon</TITLE>
  5 	<SCRIPT LANGUAGE="Javascript1.2">
  6 	<!--Javascript kodunu eski surum Browserlardan saklayalim
  7 		// fonksiyonu tanimlayalim:
  8 		function tarihsaat()
  9 		{
 10 			var saat = new Date()
 11 			saat.getTime()
 12 			document.saatForm.saatkutusu.value = saat.toString()
 13 			kronometre = setTimeout("tarihsaat()",1000)
 14 		}
 15 	//-->
 16 	</SCRIPT>
 17 </HEAD>
 18 <BODY onLoad="tarihsaat()">
 19 	<FORM method="POST" name="saatForm">
 20 		Su anda saat: <input type=text size=50 maxlength=50 name="saatkutusu">
 21 	</FORM>
 22 </BODY>
 23 </HTML>

Bu Javascript kodunda tanımladığımız değişkenin, Javascript'in otomatik bir metodundan değişken elde ettiğini görüyorsunuz.

Date(): getYear(), getMonth(), getDate(), getDay(), getTime(), getHours(), getMinutes(), getSeconds()

Bu metod, Javascript'in Browser'dan, Browser'ın işletim sisteminden, işletim sisteminin de bilgisayarın temel girdi/çıktı işlemlerini yapan (BIOS) çipinden, saati ve tarihi içeren bilgiyi almasını sağlar. Gerçi metod Date (günün tarihi) adını taşıyor, ama Date(), Javascript açısından class (sınıf) sayılır ve edinilen bilgi sadece ay, gün ve yıl bilgisini değil, o andaki saati, dakikayı ve saniyeyi de içerir.

"saat" adını verdiğimiz bu değişken, Date() metodunun sağladığı bütün bilgileri içerdiği için, içinden saate ilişkin bilgiyi söküp almamız gerekir. Date() sınıfının sağladığı bilgiyi, get... yoluyla alırız.

Burada önce biraz, hem İngilizce'den hem de Javascript dilinden Türkçe'ye tercüme yapalım:

Bu durumda getYear(), size bilgisayarın BIOS'nun ayarlı oluduğu yılı (örneğin 1999) değerini; getHours() ise bu komutun icra edildiği andaki saati (örneğin, 19) kazandıracaktır. Gördüğünüz gibi, getTime() metodu, bize olağanüstü zengin bilgi kazandırabilir.

Bizim örnek kodumuzda, "saat" değişkeninin içinden getTime() yöntemi ile, hemen her türlü tarih ve saatle ilgili bilgi demetini alıyoruz; ve bunu bir başka metod'un işlemine tabi tutuyoruz.

toString(), toLowerCase(), toUpperCase()

Javascript'in kullanılmaya hazır işlevleri (metodları) arasında Date (Tarih) nesnesine uygulanabilecek olanlarından biri toString() metodudur. Kelime anlamı String'e çevir, alfanümerik'e çevir olan bu metodla, saat nesnesinin tamamen kendine özgü biçimi, Javascript tarafından HTML'in anlayabileceği şekle çevrilmiş olur. Buradaki örnek kodda, "saat" değişkeninin içeriğini toString() metoduna tabi tutarak, alfanümerik değere çeviriyoruz ve bunu, HTML sayfasındaki Form nesnesinin "saatkutusu" isimli INPUT ögesinin içeriği haline getiriyoruz.

Javascript'te, çevirme amaçlı iki metod daha vardır. toString() metodu sadece Date nesnesine uygulanabilir, ama toLowerCase() (küçük harfe çevir) ve toUpperCase() (büyük harfe çevir) metodları bütün alfanümerik değerlere uygulanabilir. Nesneleri daha ayrıntılı ele aldığımız bölümde, alfanümerik değerlere uygulanabilecek, kullanılmaya hazır fonksiyonlar diyebileceğimiz başka metodlar bulunduğunu da göreceğiz ve hepsini birarada inceleyeceğiz

setTimeout("fonksiyonun_adı", milisaniye)

Örnek fonksiyonumuza dönersek; çevirme ve bulunan alfanümerik değeri HTML'in Form nesnesinin bir ögesinin içeriği olarak atama işleminden sonra, "kronometre" adını verdiğimiz bir değişken görüyoruz; fakat bu değişkenin değeri oldukça farklı bir ifade içeriyor: setTimeout().

setTimeout(), Javascript'in 1.2 sürümüyle gelen ve kendi kendisinin zamanlamasını belirleyen bir metoddur. Buradaki örnekte, "kronometre" değişkeninin değeri olarak, "tarihsaat" fonksiyonumuzun, her 1000 milisaniyede bir yenilenmesini istiyoruz. Bunun sonucu, Javascript, fonksiyonu her bin milisaniyede bir çalıştıracak, ve bunun sonucu olarak HTML sayfasındaki formda saatkutusu isimli kutunun değeri sürekli yenilenecektir.

Bu metoddan yararlanarak, Javascript'e, sözgelimi her sabah 6:30'da bir iş yaptırabiliriz. Bunun için, söz gelimi setTimeout metodunu içeren değişkeni, şöyle bir döngü içine koyabiliriz:

if ((saat.getHours() == 6) && (saat.getMinutes() == 30))
{
	//burada ne gibi işler yapılacaksa o işe ait komutlar olabilir, örneğin:
	document.saatForm.saatkutusu.value = saat.toString()
	//sonra setTimeout metodunu içeren zamanlama ifadesi gelir:
	kronometre = setTimeout("tarihsaat()",10000)
}

Böyle bir döngü içine alındığı zaman kronometre sadece sabah 6:30'da saati ve tarihi gösterecektir.

Değişkenleri Değerlendirme (Eval)

Buradaki örneğimizde yer almamakla birlikte bu bölümü bitirmeden bir metoddran daha söz edelyim. Javascript'in kendi hazır fonksiyonları içinde en az kullanılanı hangisidir diye sorarlarsa Değerlendirme Fonksiyonu olan eval()'dir derseniz, yanılmamış olursunuz. Buna karşılık, Javascript'in hemen hemen en kullanışlı fonksiyonlarından biri de eval() fonksiyonudur. Bir kere, eval(), programcıyı satırlarca kod yazmaktan kurtarır. Diyelim ki, Javascript programınızın bir yerinde

var toplamTutar = "((siparisMiktarı * fiyatTL) * vergi)"
if (vergiYok) {
toplamTutar = "(siparisMiktarı * fiyatTL)"
}
.......

şeklinde bir kodunuz var. Daha sonra programın herhangi bir yerinde, document.write(eval(toplamTutar)) demekle, bütün bu üç-dört satırlık kodu yazmış olursunuz. eval() sizin için değişkenlerin değerlerini bulup, sonucu değerlendirip, arzu ettiğiniz yere yazacak veya iletecektir. Bu fonksiyondan ilerde yararlanacağız

Dosya Listesi

İçindekilerGirişİndex
YukarıİlkÖncekiSonraki YokSon
Geriİleri
Yazdır