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

Javascript

Değişkenler

Değişkenler veri saklayan yapılardır. Aşağıda bazı değişkenler görülüyor:

name="ali";
number1=3;
number2=4;
length=2.3;
isSubmit=true;
sum=number1+number2;

görüldüğü gibi değişkenlerin tipleri vardır. String "" ile kullanılır. name string değişkenidir. number1, number2, length, sum sayı değişkenleridir. Sırasıyla integer, integer, float, integer tipindedir. isSubmit boolean tipindedir. Boolean tipi true(doğru) veya false(yanlış)'dır.

Diziler

Dizi javascript'te built-in nesnedir. Aşağıda bir dizi yaratıyoruz ve ilk iki elamanını değişkenlere atıyoruz.

students=new Array("ali","veli","sezai","recai");
first=students[0];
second=students[1];

new Array(elemenlar) ile bir students adında bir dizi yaratıyoruz. Dizilerdeki elemanları almak için diziAdı[index] kullanılır. Dikkat edilecek şey javascripte index'ler 0'dan başlarlar. 0 index'li eleman ilk elemandır.

İf-Else Yapısı

İf else koşul için kullanılır. Yani eğer şöylese şöyle yap,böyleyse de böyle yap demektir. Aşağıda eğer sayı 3'ten büyükse kendisiyle çarpıyoruz. Eğer küçükse kendisiyle topluyoruz

//number değişkeni daha önce verilmiş olsun
if(number>3){
	sum=number*number;
}else{
	sum=number+number;
}

Eğer number üçten büyükse number>3 ifadesi doğru olur. Doğru olunca sum number'ın karesi olur. Eğer number>3 yanlışsa o zaman else içindeki kod yürütülür.

For Döngüsü

Elinizde bir dizi var. Tüm dizinin elemanlarına aynı işlemi uygulamak istiyorsunuz. Bunun için for döngüsü kullanabilirsiniz. For döngüsünde önce ilk başlangış verilir. Sonra bir koşul verilir. En son ne kadar değiştirme yapılacağı verilir. Değiştirme işlemi koşul doğru olduğu sürece gerçekleşir. Aşağıda bir dizinin elemanlarını toplayan kod görülüyor.

sum=0;
numbers=new Array(1,2,3,4,5);
for(i=0;i<numbers.length;i++){
	sum=sum+numbers[i];
}

Bir dizinin kaç elemanlı olduğunu öğrenmek için dizi.length kullanılır. Döngü i=0'dan başlar. i dizinin boyundan küçük olduğu sürece i++ ile i 1 arttırılır. numbers[i] ile i.ninci eleman alınır ve toplama eklenir. Döngü bittiğinde tüm sayılar toplanmış olur. sum başta sıfırdır. Sonra ilk eleman eklenir. Sonra ikinci eleman eklenir ve son eleman eklendikten sonra işlem biter.

Fonksiyonlar

Fonsiyonlar bir işlem yapmak için geliştirilen kod parçasıdır. Örneğinin bir dizinin ortalamasını alan bir fonksiyon yapabilirsiniz. Böylece bir dizinin ortalamasını öğrenmeniz gerektiğinde daha önce yapmış olduğunuz bu fonksiyonu kullanırsınız. Yaptığımız fonksiyona ortalamasını almak istediğimiz diziyi vermeliyiz. Fonksiyonun dışarıdan aldığı bilgilere parametre denir. Bizim fonksiyon parametre olarak aldığı dizinin ortamasını bulup bize geri gönderir. Her fonksiyon parametre almak veya bir değer geri göndermek zorunda değildir.

function makeSum(){
	sumNumber=sum(3,4);
}
function sum(number1,number2){
	return number1+number2;
}

Yukarıdaki örnekte sum fonksiyonu number1 ve number2 adında iki parametre almaktadır. Bu iki sayıyı toplayıp sonucu geri göndermektedir. return bir değişkeni geri göndermek için kullanılır. makeSum ise hiçbir parametre almaz. İçindeki sum(3,4) ile sum fonksiyounu çağırır ve 3 ve 4 sayıları toplanır. ve sumNumber değişkenine toplam atanır. Hiç bir şeyi geri göndermez.

Nesneler

Nesne nedir. Nesne kütlesi, hacmi olan şey'dir(fen bilgisi dersleri). Gerçek hayatta her şey nesnelerden oluşur. Örneğin ali nesnedir. Ali'nin saçı, boyu, göz rengi, kilosu vardır. Bunun yanında ali uyur, yürür, yemek yer, düşünür. Ali'nin özellikleri ve eylemleri vardır. Ali'nin göz rengi onun özelliğidir. Yürümek ali'in bir eylemidir. Javascripte de nesneler gerçek hayattaki nesnelere benzer. Nesnelerin özellikleri(property) vardır. Nesnelerin eylemleri fonksiyonlarıdır. Nesnenin fonksiyonlarına method denir. Sonuç olarak bir nesnenin özellikleri ve methodları vardır. Javascriptte kullanılabilecek hazır nesneler yaratılmıştır. Aşağıda built-in nesne olan Array(dizi) örneğiyle bir nesnenin özelliklerini ve methodlarını kullanma anlatılıyor.

students=new Array("ali","bali","cali","kali","zali");
l=students.length;//Array nesnesinin length özelliği dizinin boyudur.
students.reverse();//reverse methodu elemanlarının sırasını ters çevirir.
students.sort();//alfabetik olarak dizi elemanlarını sıralar.

Genel bir şekilde yazarsak

objectName=new Object(parametreler); //yeni bir nesne yaratılıyor.
objectName.property="yeni deger"; //nesnenin özelliği değiştiriliyor.
value=objectName.property; //nensenin özelliği başka bir değişkene atanıyor.
objectName.methodName(parametreler); //nesnenin methodunu kullanılıyor.

Nesne Yaratma

Javascriptte fonksiyonları kullanarak kendi nesnelerinizi yaratabilirsiniz. Nesnelerinizin özellikleri ve fonksiyonları olabilir. Nesne yaratmak için function kelimesi kullanılır. Şimdi basit bir name nesnesi yaratalım. Bu nesnenin first (ad),last(soyad), ve display diye ad ve soyadını bir alert penceresinde gösteren bir metodu vardır.

function Name(first,last) {
  this.first  = first;
  this.last  = last;
  this.display  = displayName;
}	
function displayName() {
  alert(this.first + " " + this.last);
}

Burada name nesnesinin first, last diye iki özelliği, display diye bir metodu bulunmaktadır. Ad ve soyad bu nesne yaratılacağı zaman verilir. display ise nesne.display() şeklinde kullanılır. Nesne var zafer=new name("zafer","teker") şeklinde yaratılır. display metodunu çağırmak için zafer.display() kullanılır. Aşağıda bir örnek bulununmaktadır. Düğme tıklandığında display metodu çağrılır

Göster Gizle Kopar Satır Gizle Satır Göster
  1 <html>
  2 <head>
  3 <script language="Javascript">
  4 	function Name(first,last) {
  5 	  this.first  = first;
  6 	  this.last  = last;
  7 	  this.display  = displayName;
  8 	}	
  9 	function displayName() {
 10 	  alert(this.first + " " + this.last);
 11 	}
 12 	var aName = new Name("Mesut","Alioglu");
 13 </script>
 14 <body>
 15 <form>
 16 	<input type="button" name="display" value="display" onClick="aName.display()">
 17 </form>
 18 </body>
 19 </html>

Yarattığınız nesneler diğer yarattığınız nesnelere parametre olarak verilebilir. Şimdi bir name nesnesi yaratalım. Daha sonra bir human nesnesi yaratalım. human nesnesi de name nesnesini parametre olarak alsın.

Göster Gizle Kopar Satır Gizle Satır Göster
  1 <html>
  2 <script language="Javascript">
  3 	function name(firstname,lastname){
  4 		this.firstname=firstname;
  5 		this.lastname=lastname;
  6 	}
  7 	function Human(name,email) {
  8 		this.firstname=name.firstname;
  9 		this.lastname=name.lastname;
 10 		this.email=email;
 11 	}
 12 	function start(){
 13 		var myname=new name("Ali","Mesut");
 14 		var myhuman=new Human(myname,"mesutali@yahoo.com")		
 15 		alert(myhuman.firstname+" "+myhuman.lastname+" "+myhuman.email)
 16 	}
 17 </script>
 18 <body onLoad="start()">
 19 </body>
 20 </html>

Javascripte bir nesne başka bir nesneden türeyebilir. Yani bir mühendis insandan türer. Bir bilgisayar mühendisi'de mühendisten türer. Aşağıdaki örnekte bir human nesnesi yaratıyoruz. Sonra engineer nesnesi, ondan da ComputerEngineer nesnesi yaratıyoruz. base özelliği bir nesnenin türediği atasını gösterir. this.base=atanesne ile nesnenin ata nesneni belirleniyor. Sonra the.base(parametre) ile kuruluyor. engineer nesnesinin base'i humandır. ComputerEngineer nesnesinin base'i engineer'dir ve job'ta Bilgisyar Mühendisidir. Örnekte yap düğmesi tıklandığında serhat yaratılmakta. Ve sonra onun işi,adı ve idi alert penceresine yazılmakta.

Göster Gizle Kopar Satır Gizle Satır Göster
  1 <html>
  2 <head>
  3 <script language="javascript">
  4 	function human(name,id){
  5 		this.name=name;
  6 		this.id=id;
  7 	}
  8 	function engineer(name,id,job){
  9 		this.job=job;
 10 		this.base=human;
 11 		this.base(name,2);
 12 	}
 13 	function ComputerEngineer(name,id){
 14 		var job="Bilgisayar Mühendisi";
 15 		this.job=job;
 16 		this.base=engineer;
 17 		this.base(name,id,job);
 18 	}
 19 	function yap(){
 20 		serhat=new ComputerEngineer("Serhat","2");
 21 		alert("Job: "+serhat.job+" Name: "+serhat.name+" İd: "+serhat.id);
 22 	}
 23 </script>
 24 <body>
 25 	<form>
 26 		<input type="button" onClick="yap()" value=" yap ">
 27 	</form>
 28 </body>
 29 </html>

Dosya Listesi

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