Web Geliştiricilerinin Bilmesi Gereken 10 Tuhaf JavaScript Hatası ve Çözümleri

JavaScript geliştiricisi olmanın zorlukları arasında kaybolmak, bazen sıradan hatalarla başa çıkmaktan çok daha karmaşık olabilir. Evet, bazen hata mesajları bir kabus gibi gelebilir. Ama üzülmeyin! Bu yazıda, JavaScript dünyasında sıkça karşılaşılan ve çoğu zaman göz ardı edilen tuhaf hataları inceleyeceğiz. Hem çözüm önerileriyle hem de yaratıcı yaklaşımımızla bu hatalardan nasıl kurtulacağınızı göstereceğiz. İşte geliştiricilerin sıkça karşılaştığı 10 ilginç JavaScript hatası ve yaratıcı çözüm önerileri.

Hata:
```javascript
let a;
if (a == null) {
console.log("Değer yok");
}
```
Çıktı: "Değer yok", ama neden?

Çözüm:
JavaScript'te `null` ve `undefined` eşittir (==), ancak farklı türlerdir (===). == operatörü iki değeri eşit kabul ederken, === yalnızca aynı türde olmaları gerektiğini denetler. Bu nedenle, tip güvenliği sağlamak için === kullanmalısınız.

let a;
if (a === null) {
  console.log("Değer gerçekten null");
} else if (a === undefined) {
  console.log("Değer undefined");
}

Hata:
```javascript
let x = NaN;
console.log(x === NaN); // false
```

Çözüm:
NaN ile karşılaşıldığında, `isNaN()` fonksiyonunu kullanmak daha doğru bir yöntem olacaktır.

let x = NaN;
console.log(isNaN(x)); // true

Hata:
```javascript
let i = 0;
while (i < 10) {
console.log(i);
// Sonsuz döngüye girebilir
}
```

Çözüm:
Döngüdeki koşulun düzgün bir şekilde güncellenip güncellenmediğini her zaman kontrol edin. Bu tip hataları önlemek için `for` döngüsü daha güvenli bir seçenek olabilir.

for (let i = 0; i < 10; i++) {
  console.log(i);
}

Hata:
```javascript
function recursive() {
return recursive();
}
recursive(); // Stack overflow
```

Çözüm:
Rekürsiyon her zaman doğru bir temel durumda sonlanmalıdır. Bunu kontrol etmek için durdurma koşulları eklemek gerekir.

function recursive(count) {
  if (count <= 0) return;
  return recursive(count - 1);
}
recursive(10); // Doğru sonuç

Hata:
```javascript
const obj = {
name: "Test",
printName: () => {
console.log(this.name); // undefined
}
};
obj.printName();
```

Çözüm:
Arrow function'lar kendi `this` bağlamlarını miras almazlar. Eğer `this` kullanmak istiyorsanız, klasik fonksiyon kullanmalısınız.

const obj = {
  name: "Test",
  printName: function() {
    console.log(this.name); // "Test"
  }
};
obj.printName();

Hata:
```javascript
let arr = [1, 2, 3];
arr[5] = 100;
console.log(arr); // [1, 2, 3, <2 empty slots>, 100]
```

Çözüm:
Diziye veri eklerken, belirli bir indeksin mevcut olup olmadığını kontrol etmek önemlidir.

let arr = [1, 2, 3];
arr.push(100);
console.log(arr); // [1, 2, 3, 100]

Hata:
```javascript
console.log(globalThis); // "globalThis" mevcut olmayabilir
```

Çözüm:
Eğer eski tarayıcı desteği gerekiyorsa, `window` veya `global` gibi eski yöntemler kullanılabilir.

console.log(window); // Tarayıcı ortamında

Hata:
```javascript
import { a } from './module'; // Module not found
```

Çözüm:
Dışa aktarma işleminin doğru yapıldığından emin olun.

// module.js
export const a = 5;

Hata:
```javascript
let mySet = new Set();
mySet.add(5);
mySet.add(5); // Aynı değer ekleniyor!
console.log(mySet); // Set { 5 }
```

Çözüm:
Eğer `Set`’te benzersiz değerler olmasını istiyorsanız, değerlerin doğru eklenip eklenmediğini kontrol edin.

let mySet = new Set([1, 2, 3]);
mySet.add(4);
console.log(mySet); // Set {1, 2, 3, 4}

Hata:
```javascript
setTimeout(() => {
console.log("Bu bir hata değil!");
}, 0);
```

Çözüm:
Asenkron fonksiyonlarda işlem sırasının beklenmedik şekilde değişebileceğini göz önünde bulundurarak `Promise` yapıları kullanmak daha güvenli olabilir.

async function example() {
  await new Promise(resolve => setTimeout(resolve, 1000));
  console.log("Zamanlayıcı tamamlandı.");
}
example();