21 Nisan 2013

JAVASCRIPT NEDİR?

Bu bağlantıyı tıkladığınıza göre artık şu işi kes-yapıştırdan ileri götürmek istiyorsunuz. Bizim de amacımız bu. Size JavaScript'in genel özelliklerini ana hatlarıyla vermek. Bundan sonrası size kalmış. Genel yazım kurallarını öğrendikten sonra yapılabilecek en güzel şey diğer web-cilerin yazdıkları javascript kodlarını incelemektir. Herhangi bir problemle karşılaştığınızda bizden de yardım alabilirsiniz. Bu konu ile ilgili olarak maillerinizi bekliyoruz.
Gelelim JavaScript'in genel bazı özelliklerine. Başlangıçta bazı konulara açıklık getirelim. Java ile JavaScript oldukça fazla derecede karıştırılmakta. Java Sun firması tarafından Pascal ve Delphi dillerinden esinlenerek yazılmış bir programlama dilidir. Sonuçta tarayıcıdan bağımsız bir program elde edersiniz. Yani bir exe veya com uzantılı dosya vardır elinizde. Fakat JavaScript bu tür bir programlama dili değildir. Yorumlanması için bir tarayıcıya ihtiyaç duyar. Bu yüzden script dilidir. Html dosyasını içine gömülüdür. Sonuçta elinizde exe veya com uzantılı bir dosya yoktur. Javascript  Netscape firması tarafından
C dilinden esinlenilerek yazılmıştır. Yazılma amacı Html'in sahip olmadığı bazı özelliklerin web sayfalarında kullanılmak istenmesidir. Yani ziyaretçi ile etkileşim gibi önemli unsurlar Html'de yok veya oldukça az kapasitede diyebiliriz. Netscape firması bu konuya ağırlık vererek JavaScript script dilini internet ortamına kazandırmıştır.
Gelelim Netscape ve Internet Explorer tarayıcılarının JavaScript kodundaki farklı anlayışa. Bu gerçekten doğrudur. Netscape firması JavaScript dilini hazırladığında Microsoft firması bu dilin özelliklerini veya yazılım tarzını tam anlamıyla Internet Explorer'a eklemedi. Kendi yazım kurallarını belirledi. Bu yüzden biz JavaScript kodu yazarken bu iki tarayıcı özelliklerini de göz önünde bulundurmalıyız. Fakat bu her kodda karşımıza çıkmaz. Biz derslerimizde gerektiği yerde bu konuya yer vereceğiz.

JAVASCRİPT TARİHİ


Netscape Navigator 2.0 ile birlikte Brendan Eich tarafından geliştirilen ve önceleri Mocha daha sonra LiveScript olarak adlandırılan ve en sonunda şu anki adını alan JavaScript dili başlangıçta sadece istemci taraflı (client-side) yorumlanan (interpreted) bir dildir. Aralık 1995 tarihinde, C dilinin tarayıcılara uyarlanmış hali diyebileceğimiz JavaScript piyasaya sürüldü. Web sayfalarında dinamik içerik sağlamak ya da kullanıcıyla iletişim kurmak için kullanılmaktadır.
Ad benzerliğine karşın 'Java' ile ilişkili değildir. Yaygın yanlışlardan biri JavaScript'in basitleştirilmiş Java olarak tanımlanmasıdır.
Başlangıçta yalnız Netscape tarayıcıları üstünde çalışan JavaScript artık tüm yaygın ağ taraycıları tarafından desteklenmekte. Microsoft JavaScript'e benzer bir dil olan JScript'i geliştirdi. Microsoft Internet Explorer her iki dili de desteklerken standart olmayan JScript eklentileri diğer tarayıcılar üstünde çalışmamaktadır


JAVA VE JAVASCRİPT ARASINDAKİ FARKLAR NELERDİR?

Her ne kadar adları birbirinin nerdeyse aynısı olsa da Java ile JavaScript aynı şeyler değildir. Java bir programlama dilidir, JavaScript ise bir scripttir(Adından anlaşıldığı gibi). Farkları ise; Java ile gerçek programlar yazarsınız ancak program yazmakla uğraşmadan güzel şeyler yaratmak istenildiğinden ve ağır çalıştığından dolayı Java çok yaygınlaşmamıştır. JavaScript, ayrı bir programlama dilinden çok HTML'nin bir uzantısıdır denebilir. Tabii ki bu 'resmi' bir tanımlama değil, ama Java ve JavaScript arasındaki farkı anlatmak için iyi bir tanımlamadır.

 

JAVASCRIPT'İN GENEL ÖZELLİKLERİ

1. Javascript kodlarını yazmak için Windows kullanıcıları için NotePad  Mac. kullanıcıları için Simple Text yeterlidir.
2. JavaScript kodları --> etiketi ile biter.
3. <script> etiketi JavaScript'i anlamayan eski sürüm tarayıcıların bu kısmı geçmeleri içindir.
4. Genellikle yazım tarzı şu şekildedir:
<script>
<!--
JavaScript kodlar&yacute;
-->
</script>
5. İyi bir programcı kod satırlarında açıklama yapar. Bu satır şu işlemi gerçekleştiriyor gibi açıklayıcı bilgiler yazar kodlarının yanına. JavaScript'te bu tür açıklama // ile başlar ve // ile biter. Eğer açıklamanız bir satırdan fazla ise /* ile başlar */ ile biter.
// bu satır kullanılacak değişkenlerin tanımlanması içindir.
/* açıklama satırı; 1
açıklama satırı 2
açıklama satırı 3 */
6. JavaScript kodları Html kodların arasında yer alır. Veya uzantısı js olan dosyalarda saklanarak yine Html içerisinden çağırılır. Java Appletleri gibi Html'den ayrı bir unsur değildir. Javascript Html'in bir parçasıdır.
7. Kullanılacak yere göre Html'in içerisinde kullanılır. Fakat genelde <head> .</head> etiketleri arasında kullanılır.
8. Javascript kodları bittiğinde elinizde asla kendi başına çalışan uzantısı exe veya com olan bir dosya olmaz. Her zaman için tarayıcı tarafından yorumlanması gerekir. Yorumlanması demek Javascript kodunun çalışması anlamındadır.
9. Nesne ve buna uygulanan olaylar ile ilgili bir takım görevleri vardır. Javascript kullandığı her unsuru nesne olarak algılar. Siz bu nesneleri tıklamak  üzerine gelmek  üzerinde çıkmak gibi olaylar ile çalıştırırsınız ki bu da Javascript'in ziyaretçi ile etkileşmesi demektir.
10. Genel öğrenim yapımız diğer programlama dillerine nazaran biraz farklı olacaktır. Bu Javascript'in bir script dili olmasında ileri gelir.

                  JAVASCRİPT'LERİ ÇALIŞTIRMAK


JavaScript'i destekleyen ilk tarayıcı Netscape Navigator 2.0 idi. Tabii ki daha yeni versiyonlar da bu dili destekliyor. Her ne kadar değişik versiyonlarda bazı problemler olsa da JavaScript'i tüm Netscape ailesi destekleyecektir. Bununla beraber yakın gelecekte tüm tarayıcılar JavaScript'i destekleyeceklerdir. Örneğin yakında çıkacak olan Microsoft Internet Explorer 3.0 JavaScript desteğiyle piyasaya sürülecektir. Yani JavaScript gelecekte çok yaygın olacağından bu tekniği şimdiden öğrenmek faydalı olacaktır. Gördükçe anlayacaksınız ki JavaScript yazmak gerçekten de çok kolay. Size gereken sadece birkaç ana teknik ve çevrenizde aynı konuyla uğraşan, bilgi alışverişi yapabileceğiniz kişiler bulmaktan ibaret olacaktır.
Tabii ki JavaScript öğrenebilmeniz için öncelikle HTML hakkında bilgi sahibi olmanız gerekli. HTML hakkında Internet'te birçok kaynak mevcuttur. Yahoo'da 'html' konu başlığını ararsanız pek çok kaynak bulabilirsiniz.(Bu kaynaklar piyasadaki kitaplardan çok daha faydalıdır çünkü sürekli güncellenmektedirler. Internet'in büyüme hızına başka türlü yetişmeniz biraz zor.)
 
           

JAVASCRİPT İLE NE YAPİLABİLİR NE YAPİLAMAZ ?


 
1.  JavaScript ile web de her türlü uygulama yapilabilir mi?
Mesela bir klasörün icindeki dosyalari listeleyip orada istedigimiz bir dosyayi sürükleyerek (drag drop) baska bir klasöre atabilecek bir uygulama yapmak istedigimiz zaman bunu tamamen JavaScript ile yapabilir miyiz?
 
2.  Kevin dayımında dediği gibi hiçbir şey imkansız değildir.
 
3.  Javascript bir dildir. Client tarafında çalıştığı zaman client'ta yapılabilecek işleri yapar, server'da çalıştığı zaman server'da yapılabilecek işleri yapar.
Javascript dilini;
1. ASP kodlarınızı yazarken kullanıyorsanız, server tarafında dosyalar oluşturabilir, kopyalayabilir, silebilirsiniz.
2. Windows Scripting Host bağlamında sistem üzerinde çalışacak batchleri yazmada kullanıyorsanız gene dosyalar oluşturmak, silmek, ziplemek mümkün.
3. Eğer bir web sitesinin client tarafındaki * scripting ihtiyacını karşılamak için kullanıyorsanız bu durumda dosyalar oluşturamaz, silemezseniz. Browser üzerinde çalışan script'ler client bilgisayarın dosya sistemine, bağlı bulunduğu ağa, kurulu programına, vs. erişemez. Bu durumda Javascript ile sadece HTML sayfası bağlamında işler yapabilirsiniz. Form validation, DHTML DOM gibi. (Eğer AJAX kullanırsanız, sayfa refresh olmadan serverdan taleplerde bulunabilirsiniz. Bu Javascript'in client tarafında daha çok iş yapabiliyormuş gibi görünmesine neden olur. Aslında yapılan iş server tarafındadır.)
Sonuç olarak Javascript, DHTML DOM ile birlikte client tarafında harika bir UI dilidir. Ancak server tarafındayken UI ile hiç bir ilgisi yoktur, batch neyin programlamaya yarar.
 
4.  Hotmailin  beta versiyonunda mesela emaili sectikten sonra sürükle birak ile bir klasöre birakabiliyosun o  emaili. Böyle birsey nasil yapilabilir? Php ve javascript beraber kullanarak yapilabilir sanirim.
Ben daha önce JSP ve PHP de birseyler yapmistim ama bu tür birsey bana degisik geldi. Bununla ilgili tabiiki googleda bol miktarda dokuman var ama bildiginiz güzel dokuman sitesi var mi?
 
5.  Javascript ile çok değişik şeyler yapılabilir. Hotmail'in maillerin klasörlere sürüklenebilmesini sağlaması sadece bir örnek. Böyle bir şeyi yapmak için şu tarz bir çalışma yapabilirsiniz:

1. Bir mailin üzerindeyken farenin sol tuşuna basılmasıyla birlikte çalışan onmousedown eventi drag&drop işlemini başlatır. Bu başlatma işlemi genellikle dragging adındaki bir değikene true değerini atamakla ifade edilir.
2. Farenin sol tuşu bırakıldığında dragging=false ile sürükleme işlemi bitirilir.
3. Eğer sürükleme işleminin bittiği koordinatlarda bir klasör var ise seçili mail bu klasöre taşınır. Bu taşıma işlemi client tarafında DHTML ile görsel hale getirilirken, server tarafında bir AJAX talebiyle çaktırmadan uygulanır.

Sitemizdeki MBox kutusunun sürüklenebiliyor olması bu görselliğe bir örnektir. Eğer bizim de MBox sürüklendikten sonra bırakıldığında server tarafında yapmamız gereken bir şey olsaydı bunu bir AJAX talebine havale ederdik.

                    JAVASCRİPT DİLİ
Netscape Navigator 2.0 ile birlikte geliştirilen JavaScript dili istemci taraflı (client-side) script dilidir. Web sayfalarında dinamik içerik sağlamak ya da kullanıcıyla iletişim kurmak için kullanılır.
İlk başta yalnızca Netscape tarayıcıları için tasarlanan JavaScript, daha sonra diğer tarayıcılar tarafından da desteklenen genel bir scripting dili haline gelmiştir. Şu anda Navigator 4.0 tarafından desteklenen JavaScript 1.2 sürümü vardır. Microsoft Internet Explorer 3.0 ile JavaScript 1.0'ı desteklemektedir.

İPUCU: HTML kodları arasına yerleştirilen küçük kodlardır. Tek başına .js uzantılı JavaScript kodları da yazılabilir.

JavaScript, Java dilinin bir Light versiyonu değildir. JavaScript kendi başına bir script dilidir. Genellikle HTML sayfalarında kullanıcı kontrolleri eklemek, formları kontrol etmek, hesaplamalar yapmak gibi işler için kullanılır.

 

            JAVASCRİPT NEREDE KULLANILIR?

JavaScript kullanımının iki ana alanı vardır: istemci taraflı ve sunucu taraflı script yazmak. Şu anda HTML sayfalara gömülü yazılan scriptlerin çoğu JavaScript kullanılarak yazılmaktadır. Bunlar da genellikle kullanıcı bilgilerinin doğru girilip girilmediği ya da kullanıcıya veri girişinde ya da menü kullanımında seçenekler sağlamaktır.

Sunucu taraflı JavaScript, aynı ASP gibi çalışmaktadır.

Sunucu Taraflı JavaScript
Sunucu taraflı JavaScript (SSJS) ise temel JavaScript'e ek olarak nesneler ve işlevler katılarak veritabanlarına erişim, e-mail gönderme ve diğer işlemlerin yapılması sağlanır. SSJS, veritabanı temelli Web uygulamalarının yaratılmasını sağlar.

<SCRIPT> ETİKETİBir tarayıcının anlayacağı temel dil HTML'dir. JavaScript dilinin HTML belgesi içinde yazılabilmesi için <SCRIPT> etiketleri kullanılır.
HTML-Kodu:
 <HTML>
 
 <SCRIPT>
...
JavaScript kodu
 
....
 
</SCRIPT>
 
</HTML>

HTML-Kodu:
Örnek:
 
 
<HTML>
 
<SCRIPT>
 
document.write ("Merhaba");
 
</SCRIPT>
 
</HTML>


HTML BELGESİ İÇİNDE JAVASCRIPT YAZMAK
Bir Web sayfası organizasyonunda JavaScript'leri Web sayfasına eklemek için değişik yollar vardır:

. HEAD bölümünde

. BODY bölümünde

. BODY içinde URL olarak.


<HEAD> İçinde:

Bir HTML belgesinde HEAD bölümü içinde <SCRIPT> etiketi kullanarak istediğiniz JavaScrip kodunu HTML belgesine ekleyebilirsiniz. Bu kodlar HTML sayfasının BODY kısmı yüklendikten sonra kullanıma hazır hale gelir.

Örnek:
HTML-Kodu:
<HTML>
 
<HEAD>
 
<SCRIPT LANGUAGE="JavaScript">
 
<!--
 
function AlertTest( )
 
{
 
alert("Dikkat!");
 
}
 
// -->
 
</SCRIPT>
 
</HEAD>
 
<BODY>
 
<BODY>
İçinde

 

HTML belgesinin BODY kısmında JavaScript kullanmak için iki yol vardır:

Doğrudan çalışacak kodlar ve kullanıcı tarafından çalışacak kodlar:

Doğrudan çalışacak JavaScript kodları <SCRIPT> etiketi kullanılarak HTML belgesinin istenilen yerine yazılır. Bu cümleler tarayıcı tarafından okunduğu anda yerine getirilir:
Kod:
<SCRIPT LANGUAGE="JavaScript">
 
<!--
 
document.write("Son okunma tarihi" + document.lastModified)
 
//-->
 
</SCRIPT>
Daha çok kullanılan diğer bir yöntem ise kullanıcı tarafından bir olayın başlatılmasıyla bir JavaScript kodunun çalıştırılmasıdır. Örneğin bir düğmeye tıklamak gibi:
Kod:
<FORM>
 
<INPUT TYPE="BUTTON" NAME="TestButton"
 
VALUE="Tıkla" onClick="AlertTest()">
 
</FORM>
Örnek:
HTML-Kodu:
<SCRIPT Language="JavaScript">
 
function Onceki() {
 
  if (xmldso.recordset.bof){
 
    alert("Dosya başındasınız.");
 
  }else{
 
    xmldso.recordset.movePrevious()
 
    if (xmldso.recordset.bof){
 
      xmldso.recordset.moveFirst();
 
      alert("Bu ilk kayıt.");
 
    }
 
  }
 
}
 
function Sonraki() {
 
  if (xmldso.recordset.eof){
 
    alert("Dosya sonundasınız.")
 
  }else{
 
    xmldso.recordset.moveNext()
 
    if (xmldso.recordset.eof){
 
      xmldso.recordset.moveLast();
 
      alert("Bu son kayıt.");
 
    }
 
  }
 
}
 
</SCRIPT>
 
<BODY>
İçinde URL Olarak

JavaScript kodu URL olarak da kullanmak mümkündür:
Kod:
<A HREF="javascript: alert('Son!')">Siteden Çık</A>

UYGULAMA: Belgenin arka rengini değiştirmek:


JAVASCRİPT DİLİNİN ÖZELLİKLERİ
JavaScript dilinin temel gramer yapısına bir bakalım:

İşletme Sırası:
HTML belgesinde JavaScript eklendiğinde, kodun işletimi sırasıyla yapılır. Ancak fonksiyon ve belli bir olaya (ONCLICK gibi) bağlı olan JavaScript kodlarının işletimi o anda yapılır.

Değişkenler:
Bir değeri içeren bellek adlarını ifade ederler.

İşleçler (Operators):
Değerler ya da değişkenler arasında toplama, çıkarma gibi işlemlerin yapılmasını sağlarlar. İşleçler +, *, /, - gibi işaretlerle kullanılır.

İfadeler (Expression):
Değişkenlerin, işleçleri ve deyimlerin bir araya gelerek oluşturdukları yapılara ifade derin. Örneğin: "Ucret = Gün * Yevmiye" formülü bir ifadedir.

Deyimler (Statements):
Deyimler belli bir komut ya da söz dizimi bileşenlerinin grubuna verilen addır. Örneğin bir komut ya da bir IF yapısı deyimi oluşturur:
Kod:
if (toplam>20) {deyimler;} else {deyimler;}
Nesneler (Objects)
Kendi değerleri, özellikleri ve işlemleri olan bileşenlere nesne (object) denir. JavaScript dilinde çok sayıda yerleşik nesne vardır.

Fonksiyonlar (Functions)
Bir JavaScript fonksiyonu diğer dillerdeki bir fonksiyon yordam ya da bir alt yordam anlamına gelir. Bir fonksiyon bir dizi işlemi yerine getirir ve bir sonuç döndürür. Ayrıca fonksiyonlar, parametre olarak kabul edilen birçok değer kabul ederler.


Kod:
function adi( ) {
 
deyim 1
 
deyim 2
 
...
 
deyim N
 
}
Case Sensitivity
JavaScript case sensitive (büyük küçük harf duyarlı) bir dildir. Değişkenler ve diğer öğeler küçük ya da büyük yazılabilirler. Ancak A değişkeni ile a değişkeni birbirinden farklıdır.
Kod:
<SCRIPT LANGUAGE="JavaScript">
 
<!--
 
test= "küçük harf";
 
TEST= "BÜYÜK HARF";
 
document.writeln("test = "+test+"<BR>");
 
document.writeln("TEST = "+TEST+"<BR>");
 
//-->
 
</SCRIPT>
Açıklamalar
Bütün programlama dillerinde olduğu gibi, kod yazarken açıklama yazmak için kullanabileceğimiz bir karakter vardır. JavaScript'te bu <!- ve //-->. işaretlerinin arasıdır.
Kod:
<!-bu bir açıklamadır //-->.

JavaScript kodu diğer programlama dillerinde olduğu gibi deyimlerden (statements) oluşur. Bu deyimler atama, değerleri karşılaştırma ve işlemlerin yapılması için komutlar anlamına gelmektedir.

Alıntıdır.