Javascript ve Console kullanımı hakkında kritik bir not

Ağustos 2012 | Hakan Köse, İnternet Girişimcisi
Yazılımcı arkadaşlar bilirler, Firebug (incelemek ve indirmek için: getfirebug.com) çok kullandığımız iyi bir araç. Development esnasında kullandığımız bu araç bize yazdığımız Javascript kodlarının ve sayfalarımızın nasıl çalıştığı ile ilgili ayrıntılı bir inceleme sunuyor.

Sanırım Javascript ve JQuery ile yeni yeni tanışan arkadaşlar, ilk etapta kodlarının doğru çalışıp çalışmadığını test etmek için (henüz Firebug ile tanışmadılarsa) ilk akla gelen yöntemi kullanıp kodun ilgili yerine bir "alert" koyuyorlardır. Tabi bu çabuk bir çözüm ve iş görebiliyor çoğu zaman. Development tamamlandıktan sonra ve site güncellendiğinde; unutulan alert'lar, siteye gelen kullanıcıların halini düşünemiyorum :)

İşin aslı şu; esasen kodumuzda herhangi bir yerde bize Javascript tarafında bir ileti sunulmasını istiyorsak kullanabileceğimiz daha etkili bir aracımız var, adı "console". Konsol, bize istediğimiz tüm bilgiyi sağlar. Örnek Firebug konsol görünümü:

Javascript

Konsola development aşamasında bazı noktalarda birşeyler yazdırmak isterseniz kullanabileceğiniz 2 metoddan bahsedeceğim, bunlar:

window.console.log("message");
window.console.warn("message");

Log ve Warn bize konsolda ne istiyorsak yazmamızı sağlayan metodlar. Sadece string değil, objeleri de konsola yazdırmak mümkün.

Şimdi, yukarıda yazdığımız kodu development esnasında rahatlıkla kullanırken; production'da javascript kodlarının bazı browser'larda çalışmadığı görülür. Özelliklede Internet Explorer'da.

Alınan hata ise şuna benziyor: "'console' is undefined.." Anlayacağınız üzere, konsol yok! Evet, cidden konsol yok, ve Firefox veya Chrome gibi browser'lar bu hata oluşsa bile sonraki satırları işletmeye devam etse de, Internet Explorer bunu yapmıyor ve doğal olarak yazdığınız kodlar çalışmıyor.

Çözüm ise gayet basit: "Bu durumu tespit edecek bir fonksiyon", şöyle ki:

function LOG(message) {
if (window.console)
window.console.log(message);
}
function WARN(message) {
if (window.console)
window.console.warn(message);
}

Development esnasonda console.log veya console.warn yerine şu şekilde kullanın:

LOG('message text');
WARN('message text');

Hepsi bu kadar, artık kodlarınız konsola entegre; Internet Explorer ve tarayıcılar sizin konsolunuzu umursamıyor :)