İşlem Operatörleri :
+
Toplama
-
Çıkarma
*
Çarpma
/
Bölme
%
Bölmede kalanı verir. Örneğin: 10 % 3 işlemi 1 değerini verir.
++
Tek artırım. Değer 1 artırılır.
--
Tekli azaltma.
-
Negatifleştirme: Işlenenin negatif değerini döndürür.
Karşılaştırma Operatörleri :
==
Işlenen değerler eşitse True döndürür.
!=
Işlenen değerler eşit değilse True döndürür.
>
Soldaki değer sağdakinden büyükse True döndürür.
>=
Soldaki değer büyük ya da eşitse True döndürür.
<
Soldaki değer sağdaki değerden büyükse True döndürür.
<=
Soldaki değer sağdaki değerden küçük ya da eşitse True döndürür.
Mantıksal Operatörleri :
&&
"And" İki ifade de doğruysa True döndürür.
||
"Or" İfadelerden birisi doğruysa True döndürür.
!
"Not" Negatifleştirme işlemi doğruysa True döndürür.
Değişkenlerle Çalışmak :
var sayi = 10; // Number değişken
var degisken = True; // Boolean değişken
var yazi = “text”; // String değişken
var kus = new Array(); // Object değişken
var degisken = null; // Null değişken
*Program Akış Denetimleri :
Program çalışırken kullanıcıdan alınan bilgilerin daha sağlıklı işlenmesini ve özel durumları kontrol etmemizi sağlayan yapılardır.
if deyimi :
Programın bir değişkenin değerine göre değişmesini sağlayan denetim.
Yapısı :
if(kosullar){deyimler}
...
else{deyimler}
...
Örnek :
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1254">
<title>Javascriptte if</title>
<script language="Javascript1.2">
function goster(secme){
var endeks, secilenKus;
endeks = secme.selectedIndex;
secilenKus = secme.options[endeks].text;
if (secilenKus == "Kartal"){
document.kusForm.aciklama.value = secilenKus + " seçtiniz! Bravo!";
}
if (secilenKus == "Kanarya"){
document.kusForm.aciklama.value = secilenKus + " seçtiniz. Sizi tebrik ederiz";
}
if (secilenKus == "Papağan"){
document.kusForm.aciklama.value = secilenKus + " seçtiniz!";
}
}
</script>
</head>
<body>
<form name="kusForm">
<p>Bir Kuş seçin</p>
<select name="kuslistesi" onChange="goster(this)">
<option SELECTED>Bir kuş seçiniz</option>
<option>Kartal</option>
<option>Kanarya</option>
<option>Papağan</option>
</select><br>
<input name="aciklama" size="35">
</form>
</body>
</html>
Switch Case Deyimi:
Yapısı :
var degisken;
switch(degisken){
case >0 AND <100
deyimler;
break;
case >100 AND <1000
deyimler;
break;
default:
deyimler;
}
* Döngü Denetimleri :
For Döngüsü :
Belli bir işi belirli kere yapmanızı sağlar.
Yapısı
var i;
for(başlangıç değeri; koşul; artırım){
deyimler;
}
Örnek :
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1254">
<title>Javascriptte Çarpım Tablosu</title>
</head>
<body>
<script language="JavaScript1.2">
var i, j;
for(i=1;i <= 10;i++){
for(j=1; j <= 10; j++){
document.write(i + X + j + = + (i*j) + <br>);
}
document.write(<br>)
}
</script>
</body>
</html>
While Döngüsü :
Belli koşullar sağlandığında belli işlemlerin yapılmasını sağlar.
Yapısı :
while (koşul){
deyimler;
}
for in döngüsü :
for in döngüsü nesne işlemlerinin bir döngü içinde yapılmasını sağlar.
Yapısı :
for(degisken in nesne){
deyimler;
}
Fonksiyonlar :
Bir fonksiyon bir dizi deyimin bir blok olarak kullanılmasını sağlar. Fonksiyonlar, çağırılarak çalışan bir çalışma şekline sahiptir. Bunun anlamı,fonksiyon bir hesaplamayı yapar. Bu hesaplamadan yararlanabilmek için fonksiyon çağırılır ve hesaplamadan yararlanır. Bir fonksiyon bir ad ve argümanlarla birlikte tanımlanır. Argümanlar alınacak değerleri tanımlayan değişkenlerdir. Dikkat edilecek husus fonksiyonların mutlaka “<scsript>” etiketlerinin içinde olması gerektiğidir.
Yapısı :
function fonksiyonIsmi(arg1, arg2,..., argN){
deyimler
return sonuc;
}
Örnek :
Hemen hemen bütün örneklerimizde foksiyonlu yapılar kullandık.. diğer örneklere göz atınız.
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function rasgeleSayi(giris) {
bugun = new Date();
sayi = Math.abs(Math.sin(bugun.getTime()));
sayi = Math.round((sayi*9));
if(sayi == giris){
alert(Bildiniz!\nOyunu siz kazandiniz!);
}
else{
alert(Ben + sayi + Tutmustum bilemediniz!);
}
document.rastlanti.giris.value = ;
document.rastlanti.giris.focus();
}
</SCRIPT>
</HEAD>
<BODY>
0 ile 9 arasinda bir sayi girin !
<form name="rastlanti"><input type="text" name="giris" onBlur="rasgeleSayi(this.value)"></form>
</BODY>
</HTML>
JS nin bize sunduğu hazır ve işimize yarayacak bazı fonksiyonlara bir göz atalım.
charAt(i) : Bu fonksiyon bir değişkende “i” numaralı karakteri bize döndürür. Burada i yerine herhangi bir rakamı yazabilirsiniz. Bu kısaltma ancak sayı ya da alfanümerik değer içeren değişkene veya nesneye uygulanabilir.
Örnek :
var ucuncu;
var degisken = “cenk”;
ucuncu = degisken.charAt(3); // n değerini döndürür.
parseInt(i,n) : Gelen “i” değişkeni tam sayıya çevirir. Yanındaki “n” ise decimal (10), octal (8), hexadecimal (16) lık sistemler içindir.
Örnek :
var ucuncu, besinci, degisken;
degisken = ‘ben14’;
ucuncu = parseInt(degisken.charAt(3),10); // false
besinci = parseInt(degisken.charAt(5),10); // 1 döndürür.
Nesne.lenght() : nesnenin kaç karakterden oluştuğunu geri döndürür. Numerik yada alpha numerik değişkenlerde kullanılabilir.
Tarih fonksiyonları
Date(): getYear(), getMonth(), getDate(), getDay(), getTime(), getHours(), getMinutes(), getSeconds()
Date() : zaman classina karşılık gelir.
Örnek :
var bugun = new Date();
getYear: Yıl (1900’den sonra)
getMonth: Ay (0=Ocak - 11=Aralık)
getDate: Gün (1-31)
getHours: Saat (0-23)
getMinutes: Dakika (0-59)
getSeconds: Saniye (0-59)
Örnek :
var bugun = new Date();
document.write("Saat şu anda: ", bugun.getHours(), ":", bugun.getMinutes(), "<BR>");
document.write("Tarih ise: ", bugun.getDate(),"/", bugun.getMonth()+1,"/",bugun.getYear());
String metodları :
toString(), toLowerCase(), toUpperCase(), indexOf(), lastindexOf(), substring()
toString() : Nesneyi stringe çevirir.
toLowerCase : Nesnenin içindeki büyük harfleri küçük harfe çevirir.
toUpperCase : Nesnenin içindeki küçük harfleri büyük harfe çevirir.
indexOf(deger) : Nesnenin içinde geçen ilk “deger” değerini bulup kaçıncı sırada olduğunu döndürür.
lastindexOf(deger) : Nesnenin içinde geçen son “deger” değerini bulup kaçıncı sırada olduğunu döndürür.
Substring(i,j) : Nesnenin içindeki i. değerden sonra j. değere kadar değer daha gider ve sonucunu döndürür.
Örnek :
Nesne degiskenimizin degerini “Deneme” olarak kabul edelim.
Nesne.toLowerCase(); // deneme
Nesne.toUpperCase(); // DENEME
Nesne.indexOf(‘e’); // bu size 1 döndürür.
Nesne.indexOf(‘e’); // bu size 3 döndürür.
Nesne.substring(0.3); // bu size “Den” i döndürür.
NOT : JS de ilk eleman 0 olarak işaretlenir.
Diğer string nesnelerin methodları :
bold(), funrcolor(), fontsize(), italics()
bold() : Bağladığınız String nesnesini koyu yapar.
fontcolor(“renk”) : String nesnesinin görüntülenme rengini belirler.
fontsize(“ölçü”) : String nesnesinin görüntülenmesinde harf büyüklüğünü belirler.
italics() : String nesnesinin itelik harfle görüntülenmesini sağlar.
Örnek :
Nesne degiskenimizin degerini “Deneme” olarak kabul edelim.
Nesne.bold() : bu size <b>Deneme</b> döndürür.
Nesne.fontcolor(‘renk’) : bu size <font color=renk>Deneme</font> döndürür.
Nesne.fontsize(‘ölçü’) : bu size <font size=ölçü>Deneme</font> döndürür.
Nesne.italics() : bu size <i>Deneme</i> döndürür.
setTimeout(“fonksiyonun_adı”, milisaniye) : Javascript’in 1.2 sürümüyle gelen ve kendi kendisinin zamanlamasını belirleyen bir metoddur.
Örnek :
setTimeout(‘Kronometre()’,1000);
Örnek : Bu fonksiyonla ilgili daha detaylı örneği örnekler bölümündeki X. örnekte bulabilirsiniz.
Nesnelerin Olayları ve Özellikleri :
Javascript programcılığında nesne (object), ve nesnenin özellikleri (properties), genellikle HTML belgesinin adı (name) ve değeri (value) olan herşeydir. Bir HTML unsurunun etiketinde NAME ve VALUE bölümleri varsa, bu unsur, Javascript için nesne sayılır.
Bu tanıma göre Form, Javascript için bir nesnedir. Ayrıca Form nesnesinin bir ögesi olan INPUT, kendisi de ad ve değer alabildiğine göre, Javascript için bir nesne sayılır; fakat bu nesneye daima içinde bulunduğu nesne “dolayısıyla” atıfta bulunabilirsiniz. Bu tür atıflarda bulunurken, şu kurala uymanız gerekir:
nesneAdı.özellikAdı
Bir nesnenin durumunu, değerini veya bir özelliğini değiştiren Javascript’in kendi içinde kullanılmaya hazır işlevleri; tarih gibi, Browser’ın masaüstündeki penceresinin bir özelliği gibi değerleri belirleyen otomatik işlevleri; nesnelerin değerlerini belirli bir düzen içinde arttıran veya azaltan süreçleri; ve Javascript’in hazır şablonlarından yeni bir nesne üreten işlemleri, metod adı altında toplarız. Her nesnenin kendine ait bir metodu olabilir; bir metod birden fazla nesne ile birlikte kullanılabilir. Bu gibi ifadeleri şöyle yazarız:
nesneAdı.metodAdı (argüman)
Javascript ve niteliklerini etkilediği HTML, bir işletim sistemi ortamında, Grafik Kullanıcı Arayüzü (GUI) ile çalışan bir Browser programının içinde yer alırlar. Browser programları kendiliklerinden veya GUI sonucu, öyle bazı olaylara (örneğin Mouse işaretçisinin bir nesnenin üzerine gelmesi veya bilgisayar kullanıcısının Mouse’un veya klavyenin bir düğmesini tıklaması gibi) yol açarlar ki, bu olay işletim sistemi-GUI-Browser yoluyla HTML belgesi (ve dolayısıyla Javascript) açısından önem taşıyabilir. Bunlara Event (olay) denir, ve Javascript’e bu olayın olması halinde icra edilmek üzere özel emirler verilebilir. Bu tür komutların yazılmasında şu yöntem izlenir:
event=”fonksiyon_veya_metod (argüman)”
Aslında yukarıda özetlediğimiz üç unsuru, nesne, nesne özelliği ve Browser olaylarını buraya kadar bir çok örnekte gördük ve kullandık.