JavaScript Temelleri – Konsol Kullanımı

by erelcolak · Published 2 Ağustos 2015 · Updated 6 Aralık 2019

Merhabalar, bir önceki yazımda JavaScript temellerinde tarayıcıların JavaScript kodlarını nasıl işlediği ve kullanıcıya nasıl bir yol izleyerek sunduğunu anlatmıştım. Bu yazıda ise genlerimize kodlanmak zorunda olan Konsol kavramı , kullanımı ile ilgili bilgiler vereceğim.

Konsol (Console) kullanarak yapılan ya da oluşan JavaScript hatalarını satırına kadar görebilmeniz mümkündür. Programlamaya başladığınızda binlerce kez hata yapacaksınız. Unutmayınız ki altı üstü komut sonuna koymayı unuttuğunuz en ufak bir noktalı virgül bile programınızın çalışmamasına hata vermesine neden olacaktır. E peki hatanızın neden kaynaklandığını bilmek hele ki noktalı virgülün nerede olmadığını tespit etmek zulümdür. İşte burada konsol size yardımcı olur. Program yazarken oluşan hataların tespit edilmesi ve de düzeltilmesi programlamanın en zor ve bir o kadar da temkinli basamaklarındandır.

Şükürler olsun ki tarayıcılar sizlere bir konsol sunar ve bu konsolda nerede ne hata yaptığınızı belirtir. Böylelikle hatanızı gidermenizde yardımcı olur. Şimdi bir program yazalım basit olsun ve de bilerek hata yapalım örneğin alert kullanalım ama alert sonuna tırnak koymayı unutalım

<!DOCTYPE HTML>
<html lang="en-US">
  <head>
    <meta charset="UTF-8">
    <title></title>
  </head>
  <body>
    <script type="text/javascript">
      alert("Mesaj Buraya Gelecek);
    </script>
  </body>
</html>

Burada browser’ımızı açıyoruz ve de Google Chrome’da f12 ye basın ya da üst bölümde bulunan ayarlar düğmesine tıklayarak diğer araçlar > javascript konsolu adlı bölüme tıklayın. karşınızda konsol. konsol çalıştırdığınızda direk olarak sayfada uncought syntax error diye bas bas bağıracaktır. beklenmeyen bir tanımlama olduğunu söyler bize yani bir tırnağınız eksik der. (tamam öyle değil tam türkçesi ama yazdığımız programda hatamız bu şimdilik nabak hacı). Burada bildiğiniz gramer hatası yapmış sayılırız. dolayısı ile hata verir anında. şu şekilde:

Burada kırmızıyla belirtilen şey hatamız sağ tarafında ise ndex.html : 9 şeklinde belirtilen şey ise hangi dosyada kaçıncı satırda hata olduğunu belirtir. nağdar güzel değil mi ? evet işimize koyulalım. Şimdi ndex.html:9 yazan yere tıklayın ve anında tak diye o satırı size konsol getirir. ve hata yaptığımız satıra konsantre olarak hatamızı tespit ederiz.

Gördüğünüz gibi JavaScript düzenleyici konsol bize direk olarak nokta atışı yaparak hatanın yerini söylemektedir. Ne var ki tüm hataları ayrı ayrı gösterir. Örneğin 2. bir hata yaparsak eğer ; önce ilk hatayı gösterir sonrasında der ki bir hata daha var o da burada sonra gider onu düzeltiriz ve varsa diğer hataları da bize tek tek sunar. direk olarak hacı buralarda şu şu şu satırlarda hata yapmışsın demez. belki ileride der ama şu an demez. Zaten düşündüğünüzde ileride olması da pek işe yarar gözükmemekte.

Console.log fonksiyonu ile konsola bir şeyler yazdırma

Konsol ayrıca mesajlar yerleştirebileceğiniz dönütler hesaplamalar vs. alabileceğiniz bir yerdir. örneğin bir program yazdınız ve de çıktıyı almak ya da hata vermesini beklediğiniz yere hata mesajı yazdırmak yerine konsola yazdırabilirsiniz. bunun için kullanacağımız fonksiyon “console.log” fonksiyonudur.

kullanımı ise oldukça basittir.

alert("Merhaba Dünya");
document.write("<h1>Selamlar</h1>");
console.log("Program tam anlamıyla çalışıyor hacılar dağılabilirsiniz.");

şeklinde yazdığımızda alert verip sayfaya selamlar yazdırdıktan sonra konsolu açtığınızda programınızın son satırına yazdığınız program çalışıyor ibaresini görebilirsiniz. console.log bir çok işe yarar özellikle hata bulmak için neyin nerede hata verdiğini tespit etmemiz açısından oldukça başarı elde ederiz.

Şimdi 3 farklı şekilde çıktı alabilmeyi öğrendiniz toplamda;

1- alert ile mesaj gösterme

2- document.write ile direk belgeye yazı yazdırma

3- console.log ile konsola metin yazdırma.

Şimdilik bu kadar.