Web tasarım uygulamalarında sıkça kullanılan tarih fonksiyonlarıyla, kullanıcılarınıza yönelik bir çok uygulama geliştirebilirsiniz (Bakım aşamasında (Under construction) sayfaları, test kontrol vb.).
Bu yazımızda, javascript'te "Date" nesnesinin özelliklerini ve birkaç örnek kullanımını inceleyeceğiz. Tüm özeliklerini w3schools sayfasından inceleyebilirsiniz.
Geçerli tarih değerlerini elde etmek için kullanabileceğimiz fonksiyonların bir kısmı aşağıdaki gibidir(Tüm fonksiyonlar için yukarıdaki linki inceleyebilirsiniz):
- getDate(): Geçerli tarihteki ayın gün değerini döndürür (1-31)
- getDay(): Geçerli tarihteki haftanın gün değerini döndürür (0-6: 0:Pazar,....,6:Cumartesi)
- getFullYear(): Geçerli tarihteki yıl değerini döndürür (4 basamaklı: ör:2012)
- getHours(): Geçerli tarihteki saat değerini döndürür (0-23).
- getMilliseconds(): Geçerli tarihteki milisaniye değerini döndürür (0-999).
- getMinutes(): Geçerli tarihteki dakika değerini döndürür (0-59).
- getMonth(): Geçerli tarihteki ay değerini döndürür (0-11).
- getSeconds(): Geçerli tarihteki saniye değerini döndürür (0-59).
- getTime(): Ocak 1, 1970 tarihinden, geçerli tarihe kadar geçen milisaniye değerini döndürür.
Syntax:
İlk önce "new Date()" ile nesne oluşturulur, daha sonra istenilen şekilde fonksiyonlar kullanılır:
var tarih = new Date();
Bu nesnenin oluşturulma aşamasında 4 adet yapılandırıcı(Constructor) kullanılabilir:
- new Date( )
- new Date(milliseconds)
- new Date(datestring)
- new Date(year,month,date[,hour,minute,second,millisecond ])
Parametrelerin açıklamaları:
- Parametre yok, the Date( ): Bu yapılandırıcı ile o anki tarih ve zaman değerlerine göre bir nesne oluşturulur.
- milliseconds: Burada girilmiş olan milisaniye değeri Ocak1, 1970'den itibaren geçen mlisaniye cinsinden bir tarih oluşturur.
- datestring: Burada girilmiş olan text bazlı tarih değeri gözönünde bulundurulur (Ör.: "Jan 24, 2012").
- 7 parametre:
- year: 4 basamaklı yıl değeri (2012)
- month: 0-11 arasında ay değeri
- date: 1-31 arası gün değeri
- hour: Saat değeri(0-23).
- minute: Dakika değeri (0-59).
- second: Saniye
- millisecond: Milisaniye değeri(0-999).
Konuya yukardaki özellikleri içeren bir örnekle devam edelim:
<script type="text/javascript">
var newDate = new Date();
document.write('<ul class="list4">');
document.write('<li>Şu anki gün (0-31) <strong>>getDate()</strong>: '+newDate.getDate()+'</li>');
document.write('<li>Hafta içindeki gün (0-6) <strong>getDay</strong>(): '+newDate.getDay()+'</li>');
document.write('<li>Geçerli yıl <strong>getFullYear</strong>(): '+newDate.getFullYear()+'</li>');
document.write('<li>Saat değeri (0-23) <strong>getHours</strong>(): '+newDate.getHours()+'</li>');
document.write('<li>Milisaniye değeri (0-999) <strong>getMilliseconds()</strong>: '+newDate.getMilliseconds()+'</li>');
document.write('<li>Dakika değeri (0-59) <strong>getMinutes()</strong>: '+newDate.getMinutes()+'</li>');
document.write('<li>Ay değeri (0-11) <strong>getMonth()</strong>: '+newDate.getMonth()+'</li>');
document.write('<li>Saniye değeri (0-59) <strong>getSeconds()</strong>:'+newDate.getSeconds()+'</li>');
document.write('<li>Milisaniye değeri (01.01.1970 ten itibaren) <strong>getTime()</strong>: '+newDate.getTime()+'</li>');
document.write('</ul>');
</script>
Yukardaki kodlar aşağıdaki gibi bir sonuç döndürür:
Şimdide gaçerli tarih değerlerini değiştirmek için kullanabileceğimiz fonksiyonları inceleyelim(Tüm fonksiyonlar için yukarıdaki linki inceleyebilirsiniz):
- setDate(): Geçerli tarihe yeni gün değeri atar (1-31)
- setDay(): Geçerli tarihe yeni haftanın gün değeri atar(0-6: 0:Pazar,....,6:Cumartesi)
- setFullYear(): Geçerli tarihe yeni yıl değeri atar (4 basamaklı: ör:2012)
- setHours(): Geçerli tarihe yeni saat değeri atar (0-23).
- setMilliseconds(): Geçerli tarihe yeni milisaniye değeri atar (0-999).
- setMinutes(): Geçerli tarihe yeni dakika değeri atar (0-59).
- setMonth(): Geçerli tarihe yeni ay değeri atar (0-11).
- setSeconds(): Geçerli tarihe yeni saniye değeri atar (0-59).
- setTime(): Geçerli tarihi Ocak 1, 1970 tarihinden, milisaniye cinsinden değer atar.
"set" metotlarını kullanırken de ilk önce "new Date()" ile nesne oluşturulur, set metotlarından herhangi birini kullandığınızda, yeni oluşturulan nesnenin değeri metoda göre değişir.
var newDate =new Date(); //Şu anki gün değeri oluşturuldu
newDate.setDate(12);// artık newDate'in gün değeri 12 olarak değiştirildi, diğer değerler aynı kaldı.
<script type="text/javascript">
var newDate = new Date();
document.write('Şu anki tarih: '+newDate+'<br />');
document.write('Şu anki gün değeri tarih: <mark>'+newDate.getDate()+'</mark><hr />');
newDate.setDate(12);
document.write('Değiştirilmiş tarih: '+newDate+'<br />');
document.write('Değiştirilmiş gün değeri: <mark>'+newDate.getDate()+'</mark>');
</script>
Yukardaki kodlar aşağıdaki gibi bir sonuç döndürür:
Bu örnekle de konumuzu sonlandıralım:
<script type="text/javascript">
var mydate= new Date();
mydate.setFullYear(2013,8,22);
var today = new Date();
if(today>mydate)
{
document.write("Doğum günün çoktan geçmiş");
}
else
{
document.write("Doğum gününe daha çok var");
}
</script>
Yukardaki kodlar aşağıdaki gibi bir sonuç döndürür:
Web tasarım dünyasında, tarih özelliklerini kullanarak birçok uygulama geliştirebilirsiniz.
Kolay gelsin, görüşmek üzere...