JAVA SCRIPT

javascript

javascript

Javascriptin asıl ismi ECMAscript dir.

Javascriptin bilinen yasal ismi Ecmascripttir ve ecma organizasyon tarafından geliştirilmiştir.Ecma -262 resmi javascript standardıdır.Bu standart netscapedeki javascript ve microsofttaki jscript üzerine kurulmuştur.

Javascript Brendan Eich tarafından Netscape (tarayıcı versiyon 2.0) ile icat edilmiş ve 1996 yılından bu yana kullanılmaya başlanmıştır.

Javascript nedir ?

  • Javascript HTML sayfalara etkileşim eklemek için tasarlanmıştır.
  • Javascript bir kodlama dilidir,ve kodlama dilleri programlama dillerinin hafif versiyonlarıdır.
  • Javascript çalıştırılabilir bilgisayar kodlarından meydana gelmektedir.
  • Javascript genellikle doğrudan HTML sayfaların içersine gömülür.
  • Javascript  çevrilmiş bir dildir,herhangi bir derleme uygulanmadan çalıştırılır.
  • Javascript kullanımı lisans gerektirmez.

Javascript neler yapabilir ?

  • Javascript HTML tasarımcılarına programlayabilme özgürlüğü verir.
  • Javascript HTML sayfasına dinamik metin ekleyebilir.
  • Javascript olaylara karşılık verebilir.
  • Javascript HTML öğelerini okuyabilir ve içeriğini değiştirebilir.
  • Javascript verilerin geçerliliğini denetlemek için kullanılabilir.
  • Javascript kullanıcının tarayıcısını tesbit etmek amacıyla kullanılabilir.
  • Javascript kullanıcı bilgisayarına çerez yazmakda kullanılabilir.

JAVASCRIPT NASIL KULLANILIR

<html>

<body>

<script type=”text/javascript”>

             document.write(“bu metin javascript ile yazdırıldı”);

</script>

</body>

</html>

 

Yukardaki kod bloğu tarayıcı ekranına “bu metin javascript ile yazdırıldı” çıktısını verecektir. HTML kod bloğu içersine javascript ekleyebilmek için <script>  etiketini  kullanıyoruz,ayrıca “type=” özelliğini ,script dilini tanımlak için de kullanırız.

<script type=”text/javascript”> ve <script> bize javascriptin nerede başladığını  ve nerede biteceğini söyler.document.write ekrana yazdırmak için kullanılan standart bir javascript komutudur. Bu komutu <script> ve </script> etiketleri arasına yazarsak tarayıcı bunun bir javascript komutu olduğunu algılayacak ve bu kod bloğunu çalıştıracaktır ,bu durumda tarayıcı ekranına “ bu metin javascript ile yazdırıldı”  çıktısı görünecektir.

 

Basit tarayıcıları idare edebilmek için HTML yorumları.

 

             Javascript desteklemeyen tarayıcılar,bu komutları sayfa içeriğiymiş gibi algılar.Bu durumu engellemek için HTML de kullandığımız yorum etiketi  <!—javascript kodundan önce  ve — > javascript kodundan sonra eklenir.

 

<html>

<body>

<script type=”text/javascript”>

<!—

document.write(“bu yazı javscript ile yazdırıldı”);

//–>

<script>

</body>

</html>

 

Ileri doğru yatık iki slaş (//) JS yorum sembolüdür.Bu etiketleri kullanmamızdaki amaç JS nin –> etiketini çalıştırmasını engellemektir.

 

* body etiketi ile kullanılan JS sayfa yüklenirken çalıştırılır.

             *head etiketi içersinde kullanılan JS sayfa ilk çağrıldığında çalıştırılır.

 

                                                    JAVASCRIPTI NEREYE KOYMALIYIZ

 

Sayfadaki JS sayfa yüklendiği an çalıştırılacaktır.Bu herzaman istediğimiz bir durum değildir.Kimi zaman kodumuzun sayfa yüklendiğinde ,kimi zaman ise kullanıcı bir olayı tetiklediğinde çalıştırımasını isteriz.

 

Head  etiketindeki scriptler :Bu tür scriptler çağrıldıkları zaman çalıştırılırlar veya  bir olay tetiklendiğinde.head etiketi içersine bir kod yerleştirirseniz scriptin kimse kullanmadan önce yüklendiğine emin olursunuz.

 

Body etiketindeki scriptler:Bu kod blokları sayfa yüklendiği esnada body etiketi tetiklenince çalıştırılırlar. Bu etikete script eklerseniz sayfa içeriğini oluşturur.

 

<html>

<head>

</head>

<body>

<script type=”text/javascript”>

….

</script>

</body>

Hem body hem de head etiketinde kullanılan scriptler :Sayfanızın içersine sınırsız sayıda script yerleştirebilirsiniz,bu durumda hem body hemde head etiketi içersinde scriptiniz olabilir.

 

<html>

<head>

<script type=”text/javascript”>

….

</script>

</head>

<body>

<script type=”text/javascript”>

….

</script>

</body>

 

Dışarıdaki bir javascripti kullanmak :Bazı durumlarda aynı JS yi birçok sayfada tekrar yazmadan kullanmak isteyebilirz.

Bunu basitleştirmek için Javascripti dışarıdaki bir dosyaya yazabiliriz.Yazılan dosyayı .js uzantısı ile kaydedin.

Not:Dışarıdan çağrılan JS <script> etiketi içeremez.!

 

Dışarıdan çağırıcağınız scripti kullanmak için,kaydettiğiniz .js uzantılı dosyayı <script> etiketinin src özelliğine hedef gösterin:

 

<html>

<head>

<script scr=”javascriptdosyam.js”></script>

</head>

<body>

</body>

</html>

 

Not:Scripti normalde tam olarak nereye yazıcaksanız oraya yerleştirmeyi unutmayın.

 

*Javascript tarayıcı tarafından çalıştırılan ardışık deyimlerdir.

 

                                                                 JAVASCRPIT DEYIMLERİ

 

Bir javascript deyimi tarayıcıya yollanan komuttur.Komutttaki amaç tarayıcıya ne yapacağını söylemektir. Aşşağıdaki JS deyimi tarayıcıya “Merhaba” yazdırmasını söylüyor.

 

 document.write(“Merhaba”);

 

Çalıştıtırabilir her deyimin sonuna ; eklemek normaldir.Çoğu insan bunun iyi bir programlama uygulaması  olduğunu düşünür ve bunu web de uygulanmış örneklerde de sıklıkla göreceksiniz.

 

Noktalı virgül kullanımı opsiyoneldir(Javascript standardına bağlı olarak) ve tarayıcı satır sonunu deyimin sonu zannaeder.Bu yüzden noktalı virgül ile sonlandırılmamış bir çok örnek göreceksiniz.

Not:Noktalı virgül kullanmak bir satıra birden fazla ifade yazma imkanı sağlar.

 

JavaScript Kodu :Javascript kodu (veya sadece javascript) ardışık javascript deyimleridir.Her deyim yazılış sırasına göre tarayıcı tarafından çalıştırılır.Aşşağıdaki örnek ekrana  bir başlık ve iki paragraf yazdıracaktır.

 

<script type=”text/javascript”>

document.write(“<h1>Bu bir başlıkdır</h1>”);

document.write(“<p>Bu bir paragrafdır</p>”);

document.write(“<p>Bu başka bir paragrafdır</p>”);

</script>

 

JavaScript Blokları:

 

Javascript deyimleri birlikte blokların içersinde gruplanabilirler.Blocklar { ile başlar ve } ile biter, block da amaç ardışık deyimleri birlikte çalıştırmaktır.

 

*Yorumlar javascript i daha okukanlı yapmaktadır.

 

JAVASCRIPT YORUMLARI

 

Yorumlar Javascripti açıklamak için veya daha okunaklı yapmak için kullanılabilir,tek satırlık yorumlar // ile başlar.

 

<script type=”text/javascript”>

// Bu başlık yazdıracaktır:

document.write(“<h1>Bu bir başlıktır</h1>”);

//Bu iki paragraf yazdıracaktır:

document.write(“<p>Bu bir paragrafdır</p>”);

document.write(“<p>Bu başka bir paragrafdır</p>”);

</script>

 

Javascript Çoklu satır yorumları

 

Çoklu satır yorumları /* ile başlar */ ile biter.

 

<script type=”text/javascript”>

/* Bu başlık yazdıracaktır

 ve iki paragraf yazdıracaktır */

document.write(“<h1>Bu bir başlıktır</h1>”);

document.write(“<p>Bu bir paragrafdır</p>”);

document.write(“<p>Bu başka bir paragrafdır</p>”);

</script>

 

Not:Yorumları kod satır ve bloklarının çalışmasını engellemek içinde kullanabiliriz.Satır sonlarına noktalı virgülden sonra satırın işlevini anlatmak içinde kullanılabilir.

 

 

 

Örn1:

<script type=”text/javascript”>

/*

document.write(“<h1>Bu bir başlıktır</h1>”);

document.write(“<p>Bu bir paragrafdır</p>”);

document.write(“<p>Bu başka bir paragrafdır</p>”);

*/

</script>

 

Örn2:

<script type=”text/javascript”>

document.write(“<h1>Bu bir başlıktır</h1>”); //bu satır başlık yazdırır

</script>

 

*Değişkenler bilgiyi depolamak için kullanılan konteynırlardır.

 

                                       MATEMATİKDE DEĞİŞKENLER

 

Matematikde de x=5 ,y=7, z=x+y gibi ifadelerde kullanılmakta.Hatırlarsanız bir harf bir değer tutması için kullanılabiliyordu.Ve bu harfler dört işlemde kullanılıp dönen sonuç başka bir harfe atanabiliyordu.

Bu harfler değişkenler olarak nitelendirilmekte ve değişkenler değer tutmak için kullanılmaktadır.

 

Javascript Değişkenleri :

 

Matematikde olduğu gibi Javascript de  de değişkenler deyim veya değer tutmak üzere kullanılmaktadır. Bir değişkenin x gibi kısa bir ismi veya uzunluk gibi açıklayıcı bir ismi olabilir.Ayrıca değişkenler metin değeri de depolayabilir, isim=”ali” gibi.

Javascriptteki değişken isim kuralları ;

  • Değişken isimleri büyük/küçük harf duyarlıdır.(y ve Y farklı iki değişkendir)
  • Değişken isimleri bir harf veya altçizgi ile başlamalıdır.

NOT:Çünkü javascript büyük /küçük harf duyarlıdır ve buyüzden değişken isimleri de büyük/küçük harf duyarlı olur.

 

*Bir değişkenin değeri ,script çalışırkende değişebilir.

 

<script type=”text/javascript”>

var isim;

isim =”ali”;

document.write(isim+”<br>”);

isim=”huseyin”;

document.write(isim);

</script>

 

Ekran Görüntüsü :

 

ali

huseyin

 

Javascript değişkenleri tanımlamak(oluşturmak)

 

Javascriptte değişken oluşturmak genellikle değişken  tanımlamak olarak atfedilir.

 

var deyimi  ile değişken tanımlayabiliriz.

 

var x;

var isim;

 

Yukardeki tanımlamadan sonra değişkenler oluşturulur fakat değerleri olmaz.Aşşağıdaki şekilde değişkenlere değer atayabiliriz.

 

var x=5;

var isim=”necati” ;

 

Not:Değişkenlere metin değeri atarken değerin başında ve sonunda tırnak “ kullanmamız gerekir.

 

JavaScript değişkenlerine Değer atamak:

 

Oluşturulmuş Javascript değişkenlerine tanımlama deyimleri ile değer atayabiliriz.

 

x=5;

isim=”necati” ;

 

Değişken ismi = işaretenin solunda ve atamak istediğimiz değer = işaretinin sağında olmalıdır.Yukardaki kod deyimleri çalıştırıldıkdan sonra x değişkeni 5 değerini isim değişkeni necat değerini alır.

 

Eğer tanımlanmamış bir değişkene değer atarsak,değişken otomatik olarak oluşturulur.

 

x=5;

ile

var x=5;

 

aynı anlama gelmektedir.

 

Tanımlanmış ve değer atanmış bir değişkeni tekrar tanımlarsak değerni yitirmez:

 

var x=5;

var x;

 

Matematikde olduğu gibi javascript değişkenleri ile de matematiksel işlemler yapabiliriz.

 

* = işareti değer belirlemek için kullanılır.

* + işlemcisi değer eklemek için kullanılır.

 

x=5;

z=2;

y=x+z;

yukardeki ifadede y nin değeri x ve z nin toplamı yani 7 olur.

 

JAVASCRIPT MATEMATIKSEL İŞLEMCİLER

Matematiksel işlemciler javascriptteki değişkenler veya değerler arasında da kullanılabilir.

y=5;

 

İşlemci Tanımı Örnek Sonuç
+ Toplama x=y+2 x=7
Çıkarma x=y-2 x=3
* Çarpma x=y*2 x=10
/ Bölme x=y/2 x=2.5
% Katsayı (bölmeden kalan) x=y%2 x=1
++ Arttırma x=++y x=6
Azaltma x=–y x=4

 

Javascript değer atama işlemcileri:

 

             Bu işlemciler değişkenlere değer atamak için kullanılırlar.

x=10;

y=5;

 

İşlemci Örnek Eş anlamı Sonuç
= x=y x=5
+= x+=y x=x+y x=15
-= x-=y x=x-y x=5
*= x*=y x=x*y x=50
/= x/=y x=x/y x=2
%= x%=y x=x%y x=0

 

Metin için kullanılan + işlemcisi :

 

+ işlemcisi ayrıca metin değişkenleri veya rakamları birbirine eklemek içinde kullanılabilir.Farklı iki değişkeni eklemek için arada + işlemcisi kullananın.

 

metin1 = “Okula” ;

metin2 =”giderim” ;

metin3 =metin1+metin2;

 

yukardaki kod bloğu çalıştırıldıkdan sonra metin3 ün değeri “Okula giderim”  olur.

 

Not:Yanyana iki rakamı yazdırmak için rakamları metin olarak değerlendirmemiz gerekmektedir.Bunun için rakamların başına ve sonuna “ ekleriz.Bu sayede javascript tırnak içersinde yazılmış olan rakamı metin olarak algılar ve + işlemcisi kullanarak yanyana yazar.

             Bir metin ve bir rakamın toplamı daima yanyana yazılmış metin olacaktır.

 

 

 

 

 

 

JAVASCRIPT KARŞILAŞTIRMA VE MANTIKSAL İŞLEMCİLER

 

*Karşılaştırma ve mantıksal operatörler true(doğru) veya false(yanlış) testi yapmak için kullanılır.

 

Karşılaştırma İşlemcileri :

 

             Karşılaştırma işlemcileri mantıksal deyimlerde değişken veya değerler arasında eşitlik veya farklılık olup olmadığını anlamak için kullanılır.

 

x=5;

İşlemci Tanım Örnek
== Eşittir x==8 sonuç false
=== Tamamiyle eşittir (değer ve tip) x===5 sonuç true
x===”5″ sonuç false
!= Eşit değildir x!=8 sonuç true
> büyüktür x>8 sonuç false
< küçüktür x<8 sonuç true
>= Büyüktür veya eşittir x>=8 sonuç false
<= Küçüktür veya eşittir x<=8 sonuç true

 

Karşılaştırma işlemcileri şartlı deyimlerde değerleri kıyaslamak ve sonuca göre işlem yapmak için kullanılır.

 

İf(yas<18){

document.write(“Çok gençsin”);

}

 

Mantıksal işlemciler

 

Mantıksal işlemciler değerler veya değişkenler arasındaki mantığı anlamak için kullanılır.

 

x = 6;

y=3;

İşlemci Tanım Örnek
&& ve (x < 10 && y > 1) sonuc true
|| veya (x==5 || y==5) sonuc false
! değil !(x==y) sonuc  true

 

Şartlı İşlemciler

 

Javascript ayrıca bir şartlı işlemci barındırmaktadır,bu işlemci şarta bağlı olmak üzere değişkene değer atar.

syntax

degişken=(koşul)?değer1:değer2

ör:

durum =(cinsiyet==”erkek”)?”Bay”:”Bayan”;

 

Eğer cinsiyet değişkenin değeri “erkek” ise,durum değişkenin değeri “Bay” olarak atanacak diğer durumlarda “Bayan”.

IF…ELSE

 

*Javascriptte şartlı deyimler farklı şartlara karşı farklı eylemler göstermek için kullanılmaktadır.

 

Şartlı Deyimler

 

             Kod yazarken genellikle değişik kararlar için farklı eylemler gerçekleştirmek isteriz.Şartlı deyimleri bunun için kullanabiliriz.

Javascriptteki koşullu deyimler ;

  • if deyimi :Eğer belli bir kodu sadece bir koşul doğru olduğunda çalıştırmak istersek kullanırız
  • if else deyimi :Eğer belli bir kodu bir koşul doğru ise ve diğer kodu koşul yanlış ise çalıştırmak istersek kullanırız.
  • switch deyimi:Farklı koşullarda farklı kodlar çalıştırmak istediğimizde kullanırız.

IF deyimi :

 

             Bu deyimi sadece, belirtilmiş bir koşul doğru olduğunda çalıştırmak istediğimiz kod için kullanmalıyız.

 

<script type=”text/javascript”>

//Eğer saat 10:00 dan geri ise

//Günaydın yazdır

 

var d=new Date();

var time=d.getHours();

 

if(time <10)

{

document.write(“<b>Günaydın</b>”);

}

</script>

 

IF ELSE deyimi :

 

             Bu deyimi koşul doğruysa çalıştırmak istediğimi bir kod bloğu ve koşul yanlışsa çalıştırmak istediğimiz bir kod bloğu olduğunda kullanırız.

 

<script type=”text/javascript”>

//Eğer saat 10:00 dan geri ise

//Günaydın yazdır

 

var d=new Date();

var time=d.getHours();

 

if(time <10)

{

document.write(“<b>Günaydın</b>”);

}

else {

document.write(“Iyi Gunler”);

}

</script>

 

IF ELSE IF ELSE deyimi :

 

             Bu deyimi çalıştırılacak birçok kod arasından koşula uyan bir tanesini seçmek için kullanırız.

 

<script type=”text/javascript”>

var d = new Date()

var time = d.getHours()

if (time<10)

{

document.write(“<b>Günaydın</b>”);

}

else if (time>10 && time<16)

{

document.write(“<b>Iyi Gunler</b>”);

}

else

{

document.write(“<b>Merhaba</b>”);

}

</script>

 

Javascript Switch() deyimi :

 

             switch() parametre olarak atanan değişkenin,tanımlanmış koşullardan birini sağlaması durumda duruma özel yazılmış kod bloğunu çalıştırmamızı sağlar.

 

switch(n)

{

case 1:

 //kod bloğu 1

break;

case 2:

//kod bloğu 2

break;

default:

   //Hiçbir tanım sağlanamadığı durumda çalıştırılacak kod bloğu

}

 

Nasıl çalışıyor:Öncelikle n adında tekil bir tanımımız var(Genellikle değişken olur)bu bir defa değer verilir. Daha sonra verilen değer yapıdaki her case değeri ile kıyaslanır.Eğer bir eşleşme sağlanırsa ,durumla ilgili kod bloğu çalıştırılır.break; deyimi sıradaki case ifadesine otomatik olarak geçilmesini engeller.

 

 

 

 

 

JAVASCRIPT AÇILIR PENCERE

 

*Javascriptte üç çeşit açılır pencere oluşturabiliriz.Uyarı kutusu,Onay kutusu ve ileti kutusu.

 

Uyarı Kutusu :

 

             Uyarı kutusu genellikle bilginin kullanıcdan gelip gelmediğinen emin olmak için kullanılır.Uyarı kutusu ekrana geldiğinde kullanıcı OK i tıklamak zorunda kalır.

 

alert(“Deneme mesajı”);

 

Onay Kutusu :

 

             Onay kutusu genellikle kuıllanıcıya birşeyleri tasdik ettirmek veya kabul ettirmek için kullanılır. Onay kutusu ekrana geldiğinde kullanıcının OK ve Iptal olmak üzere iki seçeneği olur.Eğer kullanıcı OK i tıklarsa true Iptali tıklarsa false değer döner.

 

confirm(“Deneme mesajı”);

 

ileti kutusu

 

             ileti kutusu genellikle kullanıcdan birsayfaya girerken bilgi girmesini istediğiniz zaman kullanılır. İleti kutusu açıldığında kullanıcı bilgi girdikden sonra OK veya Cancel a basabilir.Eğer kullanıcı OK e basarsa kutu girdiyi değer olarak getirir,İptal e basarsa dönen değer null olur.

 

prompt(“deneme metni”,”varsayilan deger”);

 

**Varsayılan değer ,ileti kutusunun içersinde yazan yazıdır.

 

 

FONKSIYONLAR

 

Fonksiyonlar olaylar tarafından tekiklenerek veya çağrıldıklarında çalışan tekrar kullanilabilir kod bloklarıdır.

 

Javascript fonksiyonları:

            

             Tarayıcının sayfa yüklenirken kodumuzu çalıştırmamasını istiyorsak fonksyionun içersine koyabiliriz.Fonksiyon içersindeki kodlar bir olay tetiklemedikce veya çağrılmadıkca çalıştırılmazlar.

Fonksiyonları sayfanın içersinde herhangi bir yerden çağırabiliriz.(Eğer javascript dosyaysı dışardan çağrılıyorsa başka sayfalardan da çağırabiliriz).

Fonksiyonlar <head> ve <body> etiketleri arasına yazılabilirler.Fakat çağrılmadan önce fonksiyonun yüklendiğinden emin olmamamız için fonksiyonu <head> etiketi arasına koymak zekice olur.

 

syntax

function ornek(degisken1,degisken2,degisken3,…degiskenx)

{

Kodlar

}

return deyimi :

 

             return deyimi fonksiyondan dönen değeri belirtmek için kullanılır,dolayısı ile değer döndürecek bütün fonksiyonlarda return deyimi kullanılmalıdır.

 

 

function carp(a,b)

{

x=a*b;

return x;

}

 

Yukardaki fonksiyon çağrıldığında değeri x olur.Yukardaki fonksiyon çağrıldığında iki paramtre atamanız gereklir.

 

sonuc = carp(2,3)

 

Not:Fonksiyonların içinde tanımladığımız değişkenler sadece o fonksiyonun içersinden erişilebilirler. Fonksiyondan çıkınca değişkenlerde imha edilir.Bu tür değişkenler yerel değişkenler olarak adledilir. Bu tür yerel değişkenleri aynı isimler vererek farklı fonksiyonlarda kullanabilirsiniz.

Fonksiyon dışında tanımladığınız değişkenler tanımlanınca bütün sayfadaki fonksiyonlar tarafından erişilebilir ve sayfa kapanınca da imha edilir.

            

                                                    JAVASCRIPT FOR DÖNGÜSÜ

 

Javascriptde döngüler belirli bir kod bloğunu belirli bir koşul doğru olduğu sürece beliritlen sayıda tekrarlamak için kullanılır.

 

Javascript Döngüleri:Genelleikle kod yazarken aynı kod bloğunun belirli bir sıra içersinde tekrar ve tekrar çalışmasını isteriz.Neredeyse aynı olan bu kod bloklarını defalarca yazmak yerine döngüleri kullanırız.

Javascript de 2 çeşit döngü vardır;

  • for – kod bloğunu belirtilen sayı kadar tekrarlar.
  • while – kod bloğunu belirtilen koşul sağlandıkca tekrarlar.

 

for döngüsü ;Bu göndü kod bloğunu kaç defa çalıştırmak istediğinizi önceden bildiğiniz zamanlarda kullanılır.

örn syntax ;

 

 

while döngüsü;Belirtilen koşul doğru olduğu sürece tekrar tekrar çalıştırmak istediğimiz kod blokları için kullanılır.

örn syntax ;

 

 

do… while döngüsü :Bu döngü while döngüsünün başka bir şeklidir.Bu döngünün farkı ilk başta kod bloğunu çalıştırır ve koşul doğru olduğu sürece tekrarlamaya devam eder.

 

 

örn syntax;

 

Döngüleri Durdurmak ve atlamak ; break ve continue komutları ile döngüleri durdurabilir veya tekrar eden işlemlerden birini atlatabiliriz.

 

for (var i = 0;i <10 ;i++){

              if(i==3){

             continue;

             }

document.write(“sayı”+i)

}

Yukardaki kod bloğu ekrana 3 hariç sırası ile 0 ile 10 arasındaki rakamları yazdıracaktır.Yukardaki örnekde continue; yerine break; kullanılsaydı 3 den sonra döngü tekrarlanmıyacak ve dolayısı ile sonraki rakamlar yazdırılmayacaktı.

 

for in deyimi ;Bu deyim dizi değişken içersindeki elemanlar veya nesenenin özellikleri arasında gezinmekte kullanılır..For in içersinedeki kod bloğu dizinin içindeki değişkenler veya nesenin her bir özelliği için bir defa çalıştırlır.

 

var x;

var arabalar = new Array();

arabalar[0] = “anadol” ;

arabalar[1] = “opel” ;

arabalar[2] = “kartal” ;

 

for(x in arabalar){

document.write(arabalar[x] + “<br />”);

}

 

Olaylar(Events) ;Olaylar javascript tarafından algılanabilen hareketlerdir.Sayfa üzerindeki her her elemanın javascript fonksiyonlarını tetikleyebilecek kendi olayları vardır.Örneğin bir butonun onClick olayını kullanıcı butonu tıklayınca çalışacak javascript fonksiyonunu belirtmek için kullanaibliriz. Olayları HTML etiketlerinde belirtiriz.Örnek olaylar;

  • Fare ile tıklama
  • Bir sayfa veya resim yüklemesi
  • Fare ile sayfada belirlenmiş bir alanın üzerine gelinmesi.
  • HTML içersindeki bir veri giriş alanını seçmek.
  • HTML formunu onaylamak(göndermek)
  • Tuş hareketi.

Not:Olaylar genellikle fonksiyonları çalıştırmak için kullanılır.Bu fonksiyonlar da olay olmadan çalışmazlar.

 

 

Özellik Olayın çalışma şekli FF N IE
onabort Resmin yüklenmesi yarıda kalırsa 1 3 4
onblur Bir eleman odağı kaybederse(başka bir eleman seçildiğinde) 1 2 3
onchange İlgili alanın içeriği değişirse 1 2 3
onclick Fare ile tıklanırsa 1 2 3
ondblclick Fare ile çift tıklanırsa 1 4 4
onerror Sayfa veya resim yüklenirken hata oluşursa 1 3 4
onfocus Bir eleman seçilirse 1 2 3
onkeydown Herhangi bir tuşa basılırsa 1 4 3
onkeypress Herhangi bir tuşa basılırsa veya basılı tutulursa 1 4 3
onkeyup Basılan tuş bırakıldığında 1 4 3
onload Bir sayfa veya resim yüklemeyi bitirince 1 2 3
onmousedown Fare tuşuna basıldığında 1 4 4
onmousemove Fare hareket ettiğinde 1 6 3
onmouseout Fare elemanın dışına çıktığında 1 4 4
onmouseover Fare elemanın üzerine geldiğinde 1 2 3
onmouseup Bir fare düğmesi bırakıldığında 1 4 4
onreset Reset butonu tıklandığında 1 3 4
onresize Bir pencere veya frame tekrar boyutlandırıldığında 1 4 4
onselect Metin seçildiğinde 1 2 3
onsubmit Onayla butonu tıklandığında 1 2 3
onunload Kullanıcı sayfayı kapatınca 1 2 3

 

 

JAVASCRIPT try..catch DEYİMİ

 

Bu deyim bir kod bloğunu hatalara karşı denemenize yarar.Try kod alanı çalıştırılacak kod bloğunu ve catch kod alanı da hata çıkarsa çalıştırılacak kod alanını içerir.

syntax;

Yukardaki kod bloğunun try kısmında alert() fonksiyonu yazılırken imla hatası yapılmış ve buda sayfada hataya yol açmıştır.Bu durumda catch fonksiyonu devreye girip kendi bloğunda belirtilen kodbloğunu çalıştırmıştır.

 

throw;throw deyimi try.. catch deyimleri ile birlikte kullanılabilir.Deyim hata oluşturmamızı sağlar ve catch deyimi altındaki kod bloğu çalıştırılır.

 

yukardaki örnekde ,kullanıcdan 0 ile 10 arasında bir değer girmesi isteniyor.Eğer kullanıcının girdiği değer 0 dan küçükse throw  deyimi ile hata oluşturuluyor,aynı işlem girilen değer 10 dan büyük olduğunda tekrarlanıyor.catch fonksiyonu throwun gönderdiği değişkeni parametre olarak alıp if  ile içeriğini belirliyor ve duruma göre hata mesajı yazdırıyor.

 

onerror;onerror olayı da try catch deyimi gibi hata esnasında bir kodbloğunu çalıştırmak için kullanılır.  onerror olayı için çalıştıracağımız fonksiyona 3 parametre atanır:hata mesajı,url,hataya neden olan satır.

 

 

Not:Eğer false değer çevirirsek standart javascript hatası yayınlanır,true çevrilirse hata yayınlanmaz.

 

*  \ işareti metinlerin içinde özel karakterleri(javascript syntaxında kullanılan karakterler) kullanmamızı sağlar.

 

                                                                      NESNELER

Nesne Yönelimli Programlama.

 

Javascript nesne yönelimli programlama dilidir.Nesne yönelimli programlama dilleri size kendi nesnenizi ve değişken tipinizi oluşturmanıza olanak tanır.

 

Nesne kendi özellik ve metodları olan bir çeşit veridir.

 

Özellikler

 

Özellikler nesnelerle ilişkilendirilmiş değerlerdir.Aşağıdaki örnekde string türü veri nesnesinin içersinde bulunan karakter sayısını length özelliği ile buluyoruz.

 

var txt = “javascript metin uzunlukları” ;

document.write(txt.length);

 

yukardaki kod ekrana 26 yazdırır.

 

Metodlar

 

             Metodlar nesneler tarafından uygulanabilecek eylemlerdir.Aşşağıdaki örnekde toUpperCase() metodu bir string nesnesi üzerinde,string nesnesinin içindeki bütün harfleri büyük harfe çevirmek için uygulanıyor.

 

var str=”Deneme metni” ;

document.write(str.toUpperCase());

 

yukardaki kod ekrana DENEME METNİ yazdırır.

 

string nesnesi ;bu nesne kaydedilmiş bir bölük metin yönetimi için kullanılır.Bu nesne ile birlikte kullanılan metod ve özellikler aşşağıda yazılmıştır.

 

Metodlar ;

Metod Tanımı FF N IE
anchor() HTML link oluşturur 1 2 3
big() Metni büyük fontta gösterir 1 2 3
blink() Metni yanıp sönen halde gösterir 1 2
bold() Metni kalın harfde gösterir 1 2 3
charAt() Belirtilen pozisyondaki karakteri getirir. 1 2 3
charCodeAt() Belirtilen pozisyondaki karakterin Unicode halini getirir 1 4 4
concat() İki veya daha fazla metni birleştirir 1 4 4
fixed() Metni daktilo metni gibi yazdırır. 1 2 3
fontcolor() Metni belirtilen renkte yazdırır 1 2 3
fontsize() Metni belirtilen font büyüklüküğünde yazdırır 1 2 3
fromCharCode() Belirtilen Unicode değerini metne çevirir 1 4 4
indexOf() Metin içersindeki belirtilen metnin pozisyonunu getirir. 1 2 3
italics() Metni italic yazdırır. 1 2 3
lastIndexOf() Belirtilen metnin ,metin içersindeki son değerini sondan başa arayarak bulup pozisyonunu getirir. 1 2 3
link() Metni link olarak gösterir 1 2 3
match() Metin içersindeki belirtilen değeri arar. 1 4 4
replace() Metin içersindeki karakteri belirtilen karakterlerle değişir. 1 4 4
search() Metin içersinde belirtilen değeri arar. 1 4 4
slice() Metin içersindeki bir bölümü çıkarır ve başka bir metin içersinde yazar. 1 4 4
small() Metni küçük fontta gösterir. 1 2 3
split() Metni bir dizi metin haline getirir. 1 4 4
strike() Metni üzeri çizili olarak gösterir. 1 2 3
sub() Metni subscript modda gösterir. 1 2 3
substr() Belirtilen sayıda karakteri metnin içersinden çıkarır. 1 4 4
substring() Belirtilen sayılar arasındaki karakterleri metinden çıkarır. 1 2 3
sup() Metni superscript modunda gösterir. 1 2 3
toLowerCase() Metni küçük harflerle gösterir. 1 2 3
toUpperCase() Metni büyük harflerle gösterir. 1 2 3
toSource() Nesnesnin kaynak kodunu gösterir. 1 4
valueOf() Metnin ilk değerini yazdırır.

 

Özellikler ;

Özellik Tanım FF N IE
constructor Nesnesyi oluşturan fonksyion hakkında bilgi verir. 1 4 4
length Metin içersindeki karakter sayısını getirir. 1 2 3
prototype Nesneye özellik ve metod eklememizi sağlar.
1 2 4

 

JAVASCRIPT ZAMAN (date()) NESNESİ

Zaman nesnesi ,zamanlar ve saatler ile çalışmak için kullanılır.Date nesnesini new anahtar kelimesi ile tanımlayabiliriz.

var zaman = new Date() ;

Date() nesnesi değer olarak oluşturulduğu zamanı alır.

Zamanı Date() nesnesi için varolan metod ve özelliklerle kolaylıkla yönetebiliriz.

var zaman=new Date();

zaman.setFullYear(2010,0,14);

Yukardaki örnekde 2010 yılının ocak ayının 14 ünü bir zaman nesnesi olarak oluşturuyoruz.

var zaman =new Date();
zaman.setDate(zaman.getDate()+5);

Yukardaki örnekde zaman nesnesini bugünden 5 gün sonrası olarak belirliyoruz.

 

Date() nesnesine ait metodlar ;

Metod Tanım FF N IE
Date() Bugünün zaman ve saatini getirir 1 2 3
getDate() Date nesnesinden ayın gününü getirir (1-31) 1 2 3
getDay() Date nesnesinden haftanın gününü getirir (0-6) 1 2 3
getMonth() Date nesnesinden ayı getirir (0-11) 1 2 3
getFullYear() Date nesnesinden yılı 4 rakamlı olarak getirir. 1 4 4
getYear() Date nesnesinden yılı 2 veya 4 rakamlı olarak getirir. 1 2 3
getHours() Date nesnesinden saati getirir (0-23) 1 2 3
getMinutes() Date nesnesinden dakikayı getirir (0-59) 1 2 3
getSeconds() Date nesnesinden saniyeyi getirir (0-59) 1 2 3
getMilliseconds() Date nesnesinden milisaniyeyi getirir (0-999) 1 4 4
getTime() Ocak 1, 1970 den itibaren geçen milisaniyeyi getirir. 1 2 3
getTimezoneOffset() Yerel zaman ile GMT arasındaki farkı getirir 1 2 3
getUTCDate() Evrensel saate bağlı olarak date nesnesinden günü getirir(1-31) 1 4 4
getUTCDay() Date nesnesinden evrensel saate bağlı olarak günü getirir(0-6) 1 4 4
getUTCMonth() Date nesnesinden evrensel saate bağlı olarak ayı getirir (from 0-11) 1 4 4
getUTCFullYear() Date nesnesinden evrensel saate bağlı olarak dört haneli yılı getirir 1 4 4
getUTCHours() Date nesnesinden evrensel saati getirir (0-23) 1 4 4
getUTCMinutes() Date nesnesinden evrensel saate bağlı olarak dakika getirir. ( 0-59) 1 4 4
getUTCSeconds() Date nesnesinden evrensel saate bağlı olarak saniyeyi getirir (0-59) 1 4 4
getUTCMilliseconds() Date nesnesinden evrensel saate bağlı olarak milisaniyeyi getirir (0-999) 1 4 4
parse() Parametre olarak bir zaman metni alır ve ocak  1, 1970 den bu yana geçen zamanı milisaniye olarak getirir 1 2 3
setDate() Date nesnesindeki ayın gününü belirler (from 1-31) 1 2 3
setMonth() Zaman nesnesindeki ayı belirler (0-11) 1 2 3
setFullYear() Zaman nesnesindeki yılı belirler (dört rakam) 1 4 4
setYear() Date nesnesindeki yılı belirler(2 veya 4 hane). 1 2 3
setHours() Date nesnesindeki saati belirler (0-23) 1 2 3
setMinutes() Date nesnesindeki dakikayı belirler (0-59) 1 2 3
setSeconds() Date nesnesindeki saniyeyi belirler (0-59) 1 2 3
setMilliseconds() Date nesnesindeki milisaniyeyi belirler (0-999) 1 4 4
setTime() ocak 1, 1970 e belirtilen zamanı milisaniye olarak ekleyerek veya çıkararak ortaya çıkan zamanı getirir. 1 2 3
setUTCDate() Date nesnesindeki ayın günlerini evrensel saate bağlı olarak belirler (1-31) 1 4 4
setUTCMonth() Date nesnesindeki ayı evrensel saate bağlı olarak belirler (0-11) 1 4 4
setUTCFullYear() Date nesnesindeki yılı evrensel saate bağlı olarak belirler (4 hane) 1 4 4
setUTCHours() Date nesnesindeki saati evrensel saate bağlı olarak belirler(0-23) 1 4 4
setUTCMinutes() Date nesnesindeki dakikaları evrensel saate bağlı olarak belirler ( 0-59) 1 4 4
setUTCSeconds() Date nesnesindeki saniyeleri evrensel saate bağlı olarak belirler (0-59) 1 4 4
setUTCMilliseconds() Date nesnesindeki milisaniyeleri evrensel saate bağlı olarak belirler (0-999) 1 4 4
toSource() Nesnenin kaynak kodunu temsil eder. 1 4
toString() Date nesnesini metne çevirir 1 2 4
toGMTString() GMT saatine bağlı olarak Date nesnesini metne çevirir 1 2 3
toUTCString() Date nesnesini GMT saatine bağlı olarak metne çevirir. 1 4 4
toLocaleString() Yerel saate bağlı olarak Date nesnesini metne çevirir. 1 2 3
UTC() Evrensel saate bağlı olarak ocak 1 1970 den bu yana geçmiş zamanı milisaniyeye çevirir. 1 2 3
valueOf() Date nesnesinin birincil değerini getirir. 1 2 4

 

                                                                JAVASCRIPT DİZİLER(ARRAYS)

Diziler bir grup değeri tek bir değişken isminde saklamak için kullanılır.Dizileri new anahtar kelimesi ile oluştururuz.Aşşağıdaki kod yeni bir dizi oluşturur.

var dizim = new Array();

Dizilerde değer saklamanın iki yolu vardır.

1)

var arabalar = new Array();
arabalar[0]  = “Anadol” ;

arabalar[1] = “Kartal” ;

arabalar[2] =”BMW” ;

 

ayrıca dizi değişken boyutunu kontrol altında tutmak için limit mahiyetinde bir rakamı parametre olarak yazabilirirz.

 

var arabalar = new Array(3);
arabalar[0]  = “Anadol” ;

arabalar[1] = “Kartal” ;

arabalar[2] =”BMW” ;

2)

var arabalar = new Array(“Anadol”,”Kartal”,”BMW”);

 

Not:Eğer dizinin içersinde  herhangi bir mantıksal ifade veya rakam kullanırsak,değişkenlerin değeri metin yerine rakam veya mantıksal değer olur.

 

Dizilere erişmek;Dizinizin içersindeki elemanlara ,dizinin ismi ve elemanın index numarası ile erişebilirsiniz.

document.write(arabalar[0]);

 

Dizideki belli bir index numarasına sahip değişkeni değiştirmek için ,aynı index numarası ile değişken belirlemek yeterli olacaktır.

 

 

 

 

 

JAVASCRIPT DİZİ METODLARI

Metod Tanım FF N IE
concat() İki veya daha fazla diziyi birleştirip sonucu getirir 1 4 4
join() Dizinin bütün elemanlarını birlikte belirtilen ayıraç ile bir metne çevirir. 1 3 4
pop() Dizinin son elemanını silip değerini getirir. 1 4 5.5
push() Dizinin sonuna bir veya daha fazla eleman ekleyip yeni uzunluk değerini getirir. 1 4 5.5
reverse() Dizi içersindeki elemanların sırasını ters çevirir. 1 3 4
shift() Dizinin ilk elemanını silip değerini getirir. 1 4 5.5
slice() Dizi içersinde seçilen elemanların değerini getirir. 1 4 4
sort() Dizi içersindeki elemanları sıralar. 1 3 4
splice() Diziye yeni elemanlar ekler veya çıkarır. 1 4 5.5
toSource() Nesnenin kaynak kodunu getirir. 1 4
toString() Diziyi string(metin) değerine çevirip neticeyi getirir. 1 3 4
unshift() Dizinin başına bir veya daha fazla eleman ekler ve yeni uzunluk değerini getirir. 1 4 6
valueOf()

 

 

                                                                 MANTIKSAL DEĞERLER(BOOLEAN)

Boolean nesnesi mantıksal olmayan değerleri ,mantıksal değerlere çevirmek için kullanılır.(true/false)

var mantiksalDeger = new Boolean();

Not:Eğer boolean nesnesinin bir başlangıç değeri yoksa veya 0,-0,null,””,false,undefined veya NaN ise
nesne değeri false olur,diğer durumlarda ise true.(Metinsel değer false olarak atansa bile).

Aşşağıdaki boolean nesneleri false değer taşımaktadır.

 

var mantiksalDeger = new Boolean();

var mantiksalDeger = new Boolean(0);

var mantiksalDeger = new Boolean(null);

var mantiksalDeger = new Boolean(“”) ;

var mantiksalDeger = new Boolean(false) ;

var mantiksalDeger = new Boolean(NaN);

 

Aşşağıdaki satırlarda true değer taşıyan bir boolean nesnesi oluşturur.

var mantiksalDeger = new Boolean(true) ;

var mantiksalDeger = new Boolean(“true”) ;

var mantiksalDeger = new Boolean(“false”) ;

var mantiksalDeger = new Boolean(“ali”);

 

Metod Tanım FF N IE
toSource() Nesnenin kaynağını belirtir. 1 4
toString() Boolean değerini metne çevirir ve sonucu bu şekilde çevirir 1 4 4
valueOf() Boolean nesnesinin birincil değerini getirir. 1 4 4

 

Javascript matematik nesneleri ;Javascript matematik nesneleri,genel matematiksel işlem yapabilmemize olanak tanır.Bu nesne birçok matematiksel değer ve fonksiyon içerir. Bu nesneleri kullanmak için önceden tanımlamanıza gerek yoktur.

Matematiksel Değerler ;Javascript math nesnesinden çağrılabilecek sekiz değer içerir.