JavaScript dersleri 1 (JavaScript nedir? nasıl kullanılır? ne işe yarar?) :

Merhaba arkadaşlar,

Bu makalemde JavaScript’e giriş yapıp,ne işe yaradığından,çalışma mantığından ve javascripti nasıl yazacağımızdan bahsedeceğim.

JavaScript ,1995 yılında Netscape firması tarafından web programlama yapmak için geliştirilmiş tarayıcı üzerinde çalışan bir script dilidir.Bu yeni dil ilk başta Mocha daha sonra LiveScript olarak adlandırılmasına rağmen ilk sürümlerinde üzerinde Java’nın hakimiyeti bulunmasından ve Java’ya bir destek dili görünümünde olmasından dolayı JavaScript olarak adlandırılmıştır.

JavaScript ve Java

JavaScript’in adında “Java” kelimesi bulunmasına rağmen bu diller birbirinden tamamen bağımsız,farklı dillerdir.Java, masaüstü ve web uygulamaları inşa etmek için geliştirilmiş güçlü ve kompleks bir dil iken JavaScript web programlama yapmak için geliştirilmiş,tarayıcı üzerinde çalışan çok daha basit bir script dilidir.Ancak buna rağmen JavaScript çok büyük yeteneklere sahiptir.Bunları yeri geldiğinde göreceğiz.

JavaScript tarayıcı üzerinde çalışır

JavaScript,PHP ya da ASP gibi dillerin aksine tamamen tarayıcı üzerinde çalışan bir programlama dilidir.Bildiğiniz gibi php ya da asp kodları sunucu tarafından yorumlanır ve sonuç tarayıcıya html çıktısı olarak gönderilir.Bu yüzden bu diller sunucu taraflı (server-side) programlama dilleri olarak adlandırılır.

Ancak JavaScript tamamen tarayıcı tarafından yorumlanır (Yani kullanıcının bilgisayarında çalışır).Bu sebepten dolayı JavaScript , istemci taraflı (client-side) diller grubuna girer.

JavaScript ile ne yapabiliriz?

JS, daha az önce de söylediğim gibi basit bir dil olmasına rağmen programcıya çok büyük yetenekler kazandırır.Bu yeteneklerden bazıları şunlardır:

Dinamiz : Kullanıcı sayfayı gezerken bir butona tıkladığında,bir resmin ,bir elementin üzerine geldiğinde ya da sadece sayfa yüklendiğinde javascripte emirler vererek nasıl davranması gerektiğini söyleyebiliriz.Örneğin bir mesaj kutusunun gösterilmesi,gizli olan bir elementin erişilebilir hale gelmesi,bir veri giriş kutucuğunun aktif olması,var olan bir nesnesin başka tarafa sürüklenmesi ve ya bir resmin boyunun değişmesi gibi.

Veri denetimi : Bir üye giriş formunuzun olduğunu varsayalım.Kullanıcı formu gönderdiğinde sunucuda gerekli kontroller yapılır.Eğer şifre ya da kullanıcı adı yanlışsa ve ya formata uygun değilse (boş ya da normalden kısa) giriş yapılmaz ve kullanıcıya ne hata yaptığı gösterilip tekrar giriş yapması istenir.Bu sunucuya ekstra yük bindirecek ve boşu boşuna işlemi uzatacaktır.Bunun yerine daha form sunucuya gönderilmeden JavaScript’in yardımı ile kullanıcı adının ve şifre alanlarının boş olup olmadığını,istenen formata uygunluğunu kontrol edebilir,yanlış ise formun gönderilmesini engelleyebilirsiniz.

Cookieler : JavaScript yardımıyla kullanıcının bilgisayarındaki çerezleri kontrol edebilir,çerez ekleyip,düzenleyebilirsiniz.

AJAX’ı kullanabilme : Günümüzün popüler programlama biçimlerinden biri haline gelen Ajax’ı kullanabilmek için yine JavaScript’e ihtiyacınız vardır.

DHTML : DHTML (Dynamic HTML) aslında bir programlama dili değildir.JavaScript,CSS ve DOM gibi teknolojilerle dinamik ve interaktif web sayfaları yapmaya verilen isimdir.Elbetteki DHTML’in yolu JavaScript’ten geçer.Zaten bu dilin geliştirilme sebebi de dinamik web sayfaları inşa etmektir.

İlk Örneğimiz

JavaScript’i html kodları ile beraber yazabiliriz.Bu yüzden JS kodlarını html kodlarından ayırmak için javascript kodlarını etiketleri arasında yazarız.

Yukarıda gördüğünüz gibi JS kodlarını ister sayfamızın başlık bölümüne () istersek de gövde bölümüne yazabiliriz ().

Peki başlık bölümüne yazarsak ne olur? Gövde bölümüne yazarsak ne olur?

Başlık bölümüne yazdığımız javascript kodları sayfa çağrıldığında, gövde bölümüne yazdığımız javascript kodları ise sayfa yüklendiğinde çalıştırılırlar.

Bildiğiniz gibi tarayıcılar bir sayfayı yorumlamaya yukarıdan,sayfanın başından başlarlar.Bu yüzden bir sayfanın ilk başlık bölümü,daha sonra da gövde bölümü icra edilir.Doğal olarak etiketleri arasında ki JS kodları “sayfa çağrıldığında”, etiketleri arasında kodlar ise “sayfa yüklenirken” çalıştırılırlar.

Şimdi javascript ile iki örnek yapalım.Birincisinde kodlarımızı başlık bölümüne,ikincisinde ise gövde bölümüne yazıp sonucu görelim.

Sayfayı çağırdığınızda “hello world” mesajını taşıyan uyarı kutumuz,sayfamızın gövdesinde bulunan Burası başlık bölümünden sonra yüklenecek… yazısı daha sayfada görünmeden önce gösterilir.

Şimdi şöyle yapalım :

Yukarıdaki kodları çalıştırdığınızda ise önce hello world mesajının geldiğini,daha sonra da body bölümüne yazılan hello world mesajının geldiğini görürsünüz.

neden var?

Aslında bence günümüzde kullanımı gereksiz hale gelen bir yapı olsa da halen pek çok programcı tarafından kullanıldığı için ben de bu makalemdeki örneklerde yer verdim.JavaScript kodlarının başına ve sonuna html yorum taglarını yazmak bu kodları javascript desteği olmayan tarayıcılardan korumak içindir.
JavaScripti desteklemeyen bir tarayıcı javascript kodlarını düz metin gibi kullanıcıya göstereceğinden dolayı kodların başına şeklinde html yorum tagları eklenir.Böylelikle tarayıcı bu javascript kodlarını yorum olarak algılar.

//–> baştaki // ise javascriptin yorumlama karakterleridir.JavaScript // (çift slash)’tan sonra gelen karakterleri algılamaz ve onları yorum gibi davranır.
Bizim burada kullanma sebebimiz ise javascript destekleyen tarayıcıların html yorum kapatma (–>) tagını algılamayarak javascript kodlarını çalıştırmasını sağlamaktır.

type=”text/javascript”

Malumunuz üzere yazılacak script’in türünü belirler.Örneğin VBScript kodu yazacaksanız