JSX doirasida JavaScript kodida nima yozish mumkin emas?

Quyidagilarni ishlatish taqiqlanadi:

• O'zlashtirish operatorlari (faqat atributlar ichida, qiymat berilayotgan joyda).
• Aniq qiymat bilan qaytarilmaydigan ternary operator (?:).
• Tsikllar (for, while, do/while) JSX elementlarini qaytaradigan funksiyalar ichida bo'lmagan holda.
• if/else bayonotlari JSX elementlarini qaytaradigan funksiyalar ichida bo'lmagan holda yoki ternary operatoridan foydalanilmay.
• Kod bloklari ({}) JSX elementlarini aniq qaytarmasdan (masalan, faqat o'zgaruvchilarni e'lon qilish).
• Ichma-ich sharhlar // JSX ichida yoki /* JSX ichida */, faqat operatorlar yoki atributlar/elementlar o'rtasidagi sharhlar bundan mustasno.

Ruxsat etiladi:

• Qiymatlarni qaytaradigan ifodalar (o'zgaruvchilar, funksiyalar, metod chaqiriqlari).
• Mantiqiy operatorlar && va ||.
• Ternary operator ? :.
• Ob'ektlar va massivlar (agar ular ro'yxat yoki element sifatida render qilinsa).
• JSX elementlarini qaytaradigan massiv metodlari (map, filter, va boshqalar).
• JSX elementlarini qaytaradigan funksiyalar.

Misol

// Ruxsat etilmagan
const element = <p>
  let x = 10; // O'zlashtirish
  x++; // Inkrement
</p>;

// Ruxsat etilmagan
const element = <p>
  if (condition) { // If bayonoti
    return 'True';
  } else {
    return 'False';
  }
</p>;

// Funksiyalar bilan ruxsat etilgan
const renderContent = (condition) => {
  if (condition) {
    return <p>'True'</p>;
  } else {
    return <p>'False'</p>;
  }
};
const element = <div>{renderContent(true)}</div>;

// Ternary operator bilan ruxsat etilgan
const element = <p>{condition ? 'True' : 'False'}</p>;

// && bilan ruxsat etilgan
const element = <div>{condition && <p>Visible</p>}</div>;

// map bilan ruxsat etilgan
const listItems = items.map(item => <li key={item.id}>{item.name}</li>);
const element = <ul>{listItems}</ul>;