NEDIR JAVASCRIPT

HTML dokmaninda kullanici tarafli etkilesimi artirmak amaciyla ilk olarak netscape firmasinin olusturdugu bir dil.
Dilin isminin javascript konulmasinin nedeni; o donem un kazanan ve halada ununu koruyan java dilinin isminden
faydalanmaktir.

Basit bir dildir. C ye yada Java ya asina olan herkes js  kodu yazabilir. Her browser in js destegi vardir. Ve her
browser ureticisinin implementasyonu kendine aittir.  Buna ragmen standartlar(ECMA SCRIPT standarlari) var
ve bu standartlar yazilan kodun browserlarda tasinabilirligini sagliyor.

HTML VE JAVASCRIPT

Yukaridada soyledigim gibi js kullanici tarafli html dokumana, deyim yerinde ise hareketlilik getirir.

Js, html dokumana 3 sekilde eklenebilir:
1)<script>...</script> taglari icinde kod olarak eklenir.
2)Disaridan dosya olarak import edilir ki bu dosya js kodu icrerir.
<script language="JavaScript" src="/inc/menu/menu.js"></script>
3)Inline olarak html nesnelerinin icine yazilir.
<h1 onclick="alert('basti')">bas!</h1>


JS YAZARKEN KARSILASILAN BAZI SORUNLAR

Kod Karmasasi

Eger yogun js kodlu bir html dokuman yaziyorsaniz karmasa yasamaniz en dogal seydir. Ve eger baska bir
zaman kodunuzu tekrar gozden gecirmeniz gerekirse, buyuk sikintilar yasayacaksiniz demektir.

Degisken Cakismasi

Bazen kodunuzda ayni isi yapmak isteyen birden fazla html elemani bulunabilir ve bunlarin ayni anda calismasida
gerekebilir. Bu durumda global degiskenleri beraber kullanmalari sozkonusu olacagi icin kodunuz beklenmeyen
sonuclar verebilir.

NESNESEL YAKLASIM

Js de nesnesel yazimin nasil yapilabilecegini 6 madde halinde isleyelim. Object oriented dillerdeki
kavramlari tanidiginizi varsayiyorum.

1) Class tanimlamasi yapiyoruz.

              function  myClass(){ ... }

              Goruldugu gibi sinif  tanimini  "class"  keyword u kullanarak yapmadim. Onun yerine "function" nesnesini
              kullandim. Js de "function" olarak kullandigimiz keyword'u  "class" keyword u bigi dusunecegiz.

2) Nesne olusturma;

              var object = new myClass();

             Nesne olusturma diger dillerde(Java, C++) oldugu gibi  "new" keyword u kullanarak yapacagiz.

3) Alt alan ekliyoruz;
             

              function  myClass(){
                        this.variable1="ben degiskenim";
                        this.variable2=3244;
                        var privateVar=333;
              }
             

              -->"this" nesnenin kendisine referanstir.
              -->"this"  keywordu ve devamiyla tanimladigimiz degiskenler "public" tir. Yani bu alt alanlara nesne disindan
                  direkt ulasilabilir.
              -->"var"  keywordu ile tanimladiklarimiza disaridan erismemiz mumkun degildir. Bunlar "private" elemanlar gibidir.
              -->Alt alanlara ulasim soyle:

              var object1 = new myClass();
              var object2 = new myClass();

              object1.variable2=43534;
              object1.variable1="merhaba dunya";
              object2.variable1="ben degistim";
              object2.privateVar=34; // "private" alana ulasamaz . Yeni bir "public" alt alan olusturur. "Private" degisken degismez.
           

4)Nesneye method ekliyoruz
             

              function  myClass(){
                        this.variable1="ben degiskenim";
                        this.variable2=3244;

                        this.method1=function(){
                               this.variable2++;
                               return  (this.variable2 % 20);
                       }
                       this.method2=function(arg1, arg2){
                              return  (arg1*this.variable2 + arg2);
                      }
              }
             


              -->Nesneye hem argumanli hemde argumansiz iki method ekledik.

5)Nesneye "costructor" ekliyoruz:
         
             -->Burada sunu belirtmeliyimki, js de "constructor" i saglayacak bir yapi tanimlanmiyor. Dolayisiyla bunu bir sekilde
                 gerceklestirecegiz. "Constructor" gerceklestirmi icin 2 yol var

5.1) "constructor" fonksiyonu yazmak.
             

              function  myClass(arg1, arg2){
                        this.variable1="";
                        this.variable2=0;

                        this.myClass=function(a1, a2){
                               this.variable1=a1;
                               this.variable2=a2;
                       }
                       .....
                       .....
                       //diger kod parcalari
                       //constructor i  en sonda cagiriyorum

                      this.myClass(arg1, arg2);
              }


              -->Dikkat edilirse tanimladigim "constructor" fonksiyonunu daha siniftan cikmadan cagirdim. Cunku "costructor" mekanizmasi
                  nesneye dayali dillerde "compiler" tarafindan saglanir. Ayni etkiyi vermek icin kullanicinin bu fonksiyonu cagirmasina gerek
                  kalmadan  otomatik olarak constructor i  cagirmis oldum.

5.2)  Bu yontemde "constructor" gibi bir fonksiyona ihtiyac duymadan "Java" daki "static initializer" lari kopya edebiliriz. En
       nihayetinde sinif dedigimiz sey bir fonksiyondur ve cagrildigi yerde, bastan sona kadar islettirilecektir. Dolayisiyla
       kodun hemen bas tarafina "construction" islemlerini  koyabilirim.
             

              function  myClass(arg1, arg2){
                        this.variable1=arg1;
                        this.variable2=arg2;
                        .....
                        .....
                        //diger construction islemleri
                        //methodlar
              }
             

              -->myClass fonksiyonunun (sinifinin) argumanlari kontrol edilerek, farkli argumanli "constructor"lar (overloaded contructor)
                  elde edilebilir.
              -->Nesneyi olustururken:
             
              var nesne = new myClass("hosgeldin", 2345);

6)Kalitim (Inheritance) uyguluyoruz

               -->"Inheritance" OOP nin en onemli konularindan biridir. Aslinda js gibi bir script dilinde kalitimin ne kadar anlamli olacagi
                   tartisilabilir ama yinede kullanilabilecegi yerler var diye dusunuyorum. En azindan bu mekanizmayla birbirine
                   benzeyen siniflar yazarken fazla kod yazmamis oluruz ve saglam, bakimi kolay yapilabilir kodlar elde
                   edebiliriz. Dahasi kodumuz genislemeye musait olmus olur.
              -->"Multiple inheritance" yapmayacagiz (daha dogrusu yapamayacagiz)
              -->Burada kullanacagimiz anahtar kelimeler "prototype" ve "call".( ayrintili aciklama

icin)
             
             

              function  Parent(arg1){
                        this.babaNo=1;
                        var anaNo=1;     

                        Parent.prototype.init=function(arg1){     
                                   this.pVar=arg1;                             
                        }
                        this.getFamilyNo=function(){
                                  return ("Baba:"+this.babaNo+" Ana:"+anaNo);
                       }
                       this.init(arg1)
              }
 

              function Child(arg1,arg2){
                        this.publicMember="Child Member";
                        this.pMember2="Merhaba Child";
                        var privateMember=9999;
       
                       Child.prototype.init=function(arg1,arg2){
                                   Child.base.init.call(this,arg1)
                                   this.cVar=arg2;
                       }
                       this.returnAnArbitrarilyNumber=function(){
                                   return Math.round(Math.random()*10+1);
                       }
                       this.init(arg1,arg2)               
             }


             function GrandChild(arg1,arg2,arg3){
       
                      GrandChild.prototype.init=function(arg1,arg2,arg3){       
                                  GrandChild.base.init.call(this,arg1,arg2)   
                                  this.gcVar=arg3;
                      }
                      this.init(arg1,arg2,arg3); 
             }
           

           
             -->Buraya kadar olan kisimda siniflarin tanimi yaptik. Dikkat edilirse Object Oriented JS yi anlattigimiz maddelerde(6. maddeye kadar)
                 tum uygulamalari bu ornekte birlestirdik.
             -->Kalitimi saglayan iki onemli JS yapisindan kisaca bahsetmek istiyorum.
                 Ilki "prototype" tanimi.
                 <YAZAR>GrandChild.prototype.init=function(arg1,arg2,arg3){.......</YAZAR>
                 Prototype tanimi ile bir sinifa (nesneye degil)
                 yeni alt alanlar veya methodlar ekleyebilirsiniz. Bunlar sinifa ait olacagi icin(nesneye degil) hafiza kullanimda da buyuk olcude
                 fayda saglayacaktir. Prototye taniminin kalitim icin onemli bir yapi olmasinin sebebi su: Interpreter bir nesnede bir alt alan yada
                 method ariyorsa ilk once nesnenin kendisine bakar,  eger bulamazsa prototype tanimlamasina bakar ve orada arar. Bulamazsa
                 prototype  in prototype tanimlamasina bakar taki ozyinelemeli dongu sona erene kadar; buda iki sartla olur ya aradigini bulur yada
                 bakacak baska prototype kalmaz.
               
                 Ikinci onemli husus "call"  fonksiyonu.
                 <YAZAR>GrandChild.base.init.call(this,arg1,arg2)</YAZAR>
                 "Call" fonksiyonu hangi nesnenin methodunu cagirmak istiyorsak onu cagirmamizi saglar. Eger "call" fonksiyonu  kullanilmazsa;
                 (ornege gore) interpreter ilk gordugu (init) methodunu cagiracak ve hicbir zaman base class lari construct edemeyecek ve sonsuz
                 donguye girecek.Yani hep kendi kendini cagiracak. Bu duruma dusmemek icin call fonksiyonunu kullaniyoruz.
                 -->Asagidaki kod parcasi kalitim i saglayan asil kod parcasidir. "Child" sinifi "prototype" ina "Parent" sinifina alarak genisliyor ve yine
                 "Child" sinifi kendi sinif tanimina "base" nesnesi olarak Parent in prototype ini aliyor. Akla gelen soru neden Parent degilde Parent in
                 "prototype" i cevabi da zaten kendisi veriyor. Interpreter prototype yapisi sayesinde bir methodu ozyinelemeli olarak arayabiliyor.
           
           
           

             Child.prototype = new Parent();
             Child.base=Parent.prototype;
             GrandChild.prototype = new Child();
             GrandChild.base=Child.prototype;
           
             /*test test test test test test test test test*/ 
                            var gcObj=new GrandChild(5,7,22) 
                            alert(gcObj.pVar)
                            alert(gcObj.cVar)
                            alert(gcObj.gcVar)
                            alert(gcObj.getFamilyNo()) 
                            alert(gcObj.returnAnArbitrarilyNumber())
                            alert(gcObj.privateMember)   //!!!undefined verir. 
             /*test test test test test test test test test*/ 
           

           
           

            Bu yazida JS nin nasil nesneye dayali yazilabilecegini gormus olduk. JS  yazmayi dusunen yada yazan arkadaslara yardimci olabilecegini
            dusunuyorum.
Mehmet Dogan
memetdo@hotmail.com

Kaynak www.programlama.com/sys/c2html/view.php3