Diğer dillerde olduğu gibi javascript dilinde de hata yakalama (try-catch) yapısı bulunmaktadır. Try-catch uygulamasında, websitenizde kontrol edilmesini istediğiniz kodları "try" bloğu içine koyarsınız, bir hata oluştuğunda hata bildirisi oluşturup ("throw"), "catch" bloğu içinde de bu hatanın tanımını ve gösterimini yaparsınız. Hata gösterimini standart kendi sisteminden alabileceğiniz gibi ("err.message"), kendinize göre de hata mesajları oluşturabilirsiniz.
Website girişlerinde özellikle girilecek verilere göre bir hata kontrol mekanizması çalıştırmak istediğinizde veya web tasarım sonrası kodlama
aşamasında yapacağınız hataları yakalamak için "try catch" yapısını kullanabilirsiniz, böylece olası hataları önceden kontrol
etmiş olursunuz.
index.html:
Website form uygulamalarında da kullanabileceğiniz aşağıdaki kodda, kullanıcıdan isim girmesini istiyoruz, eğer boş bir değer gönderirse, hata bildirisi yapıyoruz ve gerekli uyarıları veriyoruz.
<div id="isim"></div>
<script type="text/javascript">
var isim=prompt("İsim giriniz:","Gökhan");
try
{
if(isim==""){
throw "uyari1";
}
document.getElementById("isim").innerHTML=isim;
}
catch(err){
if(err=="uyari1"){
alert("İsim boş bırakılamaz.");
document.getElementById("isim").innerHTML=
"HATA!--İsim boş bırakılamaz.";
}
}
</script>
Kısaca:
- 3. satırda "isim" adlı bir değişken oluşturduk ve "prompt" ile kullanıcının isim girmesini istedik (Girilen değer "isim" değişkeninin değeri olacaktır).
- 4. satırda "try" bloğumuzu başlattık.
- 7. satırda hata bildirisi oluşturduk, eğer herhangi bir değer girilmemişse "uyari1" oluşturuldu (throw("uyari1")).
- 9. satırda, girilen değerde bir problem yoksa "isim" katmanına (div) değerin yazılmasını sağladık
- 11. satırda "catch" bloğunu başlattık.
- 13.. satırda hata durumunda "alert box" ile uyarı vermesini istedik.
- 14. satırda da "isim" katmanına uyarıyı yazmasını istedik.
İpucu..
Bu kodları oluştururken bir noktaya daha dikkatinizi çekmek istedim, javascript kodlarımızı "isim" adlı katmanımızın (div) altına yerleştirdim, eğer bu kodları standart olduğu gibi <head> </head> arasına koymuş olsaydım "isim" katmanında herhangi bir sonuç göremeyecektik.
Çünkü: ilk önce javascript kodları işleme girecekti, bu durumda "isim" katmanı henüz işlenmediği için bu katmana müdahale edemeyecekti.
Kodları aşağı kısma yazdığımızda ise, tarayıcımız ilk önce "isim" katmanını işleyecek daha sonra da javascript kodlarını okuyacağından herhangi bir problem kalmayacaktır.
Tabii ki bu problemin üstesinde gelme yöntemleri de var. Aşağıdaki kodlamada bu çözümü inceleyebilirsiniz.
Kodlarımızı "isimGonder()" adlı fonksiyon olarak yazdık "body" kısmını <body onload="isimGonder()"> şeklinde düzenleyerek tüm sayfa yüklendikten sonra javascript kodlarımızın çalıştırılmasını istedik. Bu durumda "isim" katmanının algılanmasında herhangi bir problem kalmamış oldu.
HTML Yapı:
<body onload="isimGonder()">
<div id="isim"></div>
Javascript Yapı:
<script type="text/javascript">
function isimGonder(){
var isim=prompt("İsim giriniz:","Gökhan");
try
{
if(isim==""){
throw "uyari1";
}
document.getElementById("isim").innerHTML=isim;
}
catch(err){
if(err=="uyari1"){
alert("İsim boş bırakılamaz.");
document.getElementById("isim").innerHTML=
"HATA!--İsim boş bırakılamaz.";
}
}
}
</script>
Son dönemlerde, web tasarım dünyasında javascript, eskisi gibi sadece küçük animasyonlar ve uyarılar
için değil, çok daha kapsamlı olarak kullanılmaktadır. Uzayan kodlarda sıkıntı yaşamamak için, belli kısımlarda try-catch yapısını
kullanmak eminim kodlarınızı takip etme açısından çok yararlı olacaktır.
Görüşmek üzere...
