1. Hata Ne Zaman Görülür?
Örneğin, bir JSX bileşeninde kapanmamış bir HTML etiketi veya eksik bir virgül görmek, size bu hatayı verebilir. Hadi birlikte birkaç yaygın hataya göz atalım.
2. Yaygın Sebepler ve Çözüm Yolları
JSX kullanırken, özellikle HTML etiketlerinin doğru şekilde kapanıp kapanmadığını kontrol etmek çok önemlidir. Eğer bir `
Örnek bir hata:
```jsx
// Hatalı
const MyComponent = () => {
return (
Hello World
);
};
```
Yukarıdaki örnekte `
```jsx
// Doğru
const MyComponent = () => {
return (
Hello World
);
};
```
# 2.2. JavaScript'teki Eksik Virgüller
```jsx
// Hatalı
const person = {
name: "John"
age: 30 // Eksik virgül burada
};
```
Bu hata, çok basit bir eksiklikten kaynaklanabilir. Yalnızca eksik olan virgülü eklediğinizde problem çözülür:
```jsx
// Doğru
const person = {
name: "John",
age: 30
};
```
# 2.3. Spread Operator'ü Hatalı Kullanma
Hatalı kullanım:
```jsx
// Hatalı
const person = { name: "John" };
const updatedPerson = { ...person, age: 30 // Eksik kapanış
};
```
Buradaki hatayı çözmek için, açılış ve kapanış parantezlerini düzgün şekilde yerleştirmeniz gerekmektedir:
```jsx
// Doğru
const person = { name: "John" };
const updatedPerson = { ...person, age: 30 };
```
# 2.4. JavaScript ve JSX Ayrımını Anlamak
Hatalı kullanım örneği:
```jsx
// Hatalı
const MyComponent = () => {
return (
const name = "John"; // JavaScript kodu JSX içinde doğru değil
Hello {name}
);
};
```
Bu hatayı çözmek için JavaScript kodunu JSX dışında yazmanız gerekir:
```jsx
// Doğru
const MyComponent = () => {
const name = "John";
return
Hello {name}
;};
```
3. Çözüm İçin Genel İpuçları
- Parantez ve süslü parantezleri dikkatle kullanın: JSX ve JavaScript kodlarının doğru bir şekilde iç içe geçtiğinden emin olun.
- Editor kullanın: Kod yazarken hata yapmamak için bir kod editörü kullanmak size büyük avantaj sağlar. Visual Studio Code gibi editörler, size çok sayıda yardımcı özellik sunar.
- Hata mesajlarına dikkat edin: "Unexpected token" hatası aldığınızda, hata mesajını dikkatlice inceleyin. Hata mesajı, genellikle hangi satırda sorunun olduğunu belirtecektir.