Kapsam Hataları (Scope Errors)
Kod yazarken kapsam hataları, özellikle fonksiyonlar arası değişken erişiminde sıkça karşılaşılan bir sorundur. JavaScript, her değişkenin tanımlandığı yerin kapsamını belirler. Eğer bir değişkeni yanlış bir kapsamda kullanırsanız, beklenmeyen sonuçlarla karşılaşabilirsiniz. Örneğin:
function testScope() {
var myVar = "Hello";
}
console.log(myVar); // Bu satır hata verir!
Bu durumda `myVar` değişkeni yalnızca `testScope()` fonksiyonu içinde geçerlidir. Dolayısıyla fonksiyon dışında erişmeye çalıştığınızda hata alırsınız. Bu tür hataları önlemek için değişkenlerinizi doğru kapsamda tanımladığınızdan emin olun.
Async/Await ve Promise Hataları
Asenkron işlemler JavaScript'te oldukça yaygındır ve doğru yönetilmediğinde karmaşık hatalara yol açabilir. Özellikle `async/await` yapısında hatalar oldukça yaygındır. Bu yapıları doğru şekilde kullanmadığınızda, beklenmedik sonuçlar alabilirsiniz. Örneğin, yanlış sırayla yazılan asenkron fonksiyonlar:
async function fetchData() {
const data = await fetch("https://api.example.com/data");
const jsonData = await data.json();
console.log(jsonData);
}
Burada dikkat edilmesi gereken en önemli nokta, `await` anahtar kelimesinin yalnızca bir Promise nesnesi ile kullanılabilmesidir. Promise zincirlerinin doğru bir şekilde yönetilmesi gerekir. Aksi halde, beklenmedik sıralamalar ve hatalarla karşılaşabilirsiniz.
DOM Manipülasyon Hataları
JavaScript ile sayfa üzerinde yapılan DOM manipülasyonları, bazen karmaşık hale gelebilir. Yanlış DOM öğeleri ile etkileşim, hatalara yol açabilir. Örneğin, bir öğe henüz yüklenmeden ona erişmeye çalışmak:
document.getElementById("myButton").addEventListener("click", function() {
alert("Button clicked!");
});
Eğer `myButton` öğesi sayfa yüklendikten sonra dinamik olarak eklenmişse, bu kod hataya yol açabilir çünkü o öğe henüz mevcut değildir. Bu tür hataları önlemek için, DOM tamamen yüklendikten sonra işlemlerinizi yapmalısınız. Bunun için `DOMContentLoaded` olayını kullanabilirsiniz.
Değişken Tipi Hataları
JavaScript, tür dönüşümlerine oldukça yatkın bir dil olsa da, bu özellik bazen hatalara yol açabilir. Örneğin, bir sayıyı ve bir string'i topladığınızda farklı sonuçlar elde edebilirsiniz:
let num = 5;
let str = "10";
let result = num + str; // 510
Burada, JavaScript otomatik olarak sayıyı string'e dönüştürür ve sonuçta `"510"` elde ederiz. Bu tür hataları önlemek için, tür dönüşümünü açıkça belirtmek ve doğru veri türlerini kullanmak önemlidir.
Event Listener ve Callback Hataları
Event listener'larını kullanırken yapılan hatalar da yaygın bir sorundur. Özellikle callback fonksiyonlarının doğru şekilde bağlanmaması, fonksiyonların yanlış çalışmasına yol açabilir. Örneğin:
document.querySelector("#myButton").addEventListener("click", () => {
console.log("Button clicked!");
});
Bununla birlikte, zaman zaman bir event handler'ın doğru bağlanmaması, olayın tetiklenmemesiyle sonuçlanabilir. Bu gibi sorunların önüne geçmek için, doğru seçici ve uygun parametrelerle event listener'larınızı düzenlemelisiniz.
JSON ve API Hataları
API'den veri alırken yapılan hatalar, çoğu zaman beklenmeyen sonuçlar doğurabilir. JSON verisinin doğru formatta olmaması, API'den yanlış veri alınması gibi durumlar yazılım geliştirmede sıkça karşılaşılan sorunlardır:
fetch("https://api.example.com/data")
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error("API Hatası:", error));
Yukarıdaki kodda, API yanıtının düzgün bir şekilde JSON formatına dönüştürülmesi gerekir. Aksi takdirde, `response.json()` fonksiyonu hata verebilir. Bu nedenle, API yanıtlarını doğru bir şekilde işlemek ve hata durumlarını ele almak önemlidir.
Küresel Değişken Kullanımı ve Temizlik
JavaScript’te küresel değişkenlerin kullanımı, özellikle büyük projelerde ciddi sorunlara yol açabilir. Herhangi bir yerde tanımlanan küresel değişken, tüm kodda erişilebilir olduğundan, değişkenlerinizi doğru bir şekilde izole etmeniz gereklidir. Aksi takdirde, değişkenler arasında çakışmalar yaşanabilir.
var globalVar = "I am global!";
function testFunction() {
console.log(globalVar); // globalVar her yerden erişilebilir!
}
Küresel değişkenlerden kaçınmak ve gerektiğinde bir modül yapısına geçmek, kodunuzu daha güvenli hale getirecektir.
