React.js, JSX'i bir bileşen ve öğe ağacı oluşturmak için XHTML benzeri bir sözdizimi olarak sağlar. JSX Javascript için derler ve doğru JSX döngü veya koşul sağlamak yerine, Javascript doğrudan kullanın:
<ul>
{list.map((item) =>
<li>{item}</li>
)}
</ul>
Henüz açıklayamadığım şey, benzer yapıların JSP'de kötü olduğu düşünülürse neden iyi sayılır?
JSP'de böyle bir şey
<ul>
<% for (item in list) { %>
<li>${item}</li>
<% } %>
</ul>
gibi etiketlerle çözülecek bir okunabilirlik sorunu olarak kabul edilir <c:forEach>. JSTL etiketlerinin ardındaki mantık da JSX için geçerli olabilir gibi görünüyor:
- XHTML benzeri sözdizimi (açılı ayraçlar, iç içe geçme) ve Java / Javascript (kıvrımlar, virgüller, parenler) arasında geçiş yapmadığınızda okumak biraz daha kolaydır
- oluşturma işlevinin içinde kullanabileceğiniz tam bir dil ve platform varsa, oraya ait olmayan bir mantık koymaktan vazgeçirecek daha az şey vardır.
JSX'in neden farklı olduğunu düşünebilmemin tek nedeni:
Java, yanlış bir şey yapmak için bir teşvik vardı - JSP sıcak yeniden yüklenecek, bu yüzden bir yeniden oluşturma / yeniden başlatma döngüsü önlemek için JSPs kodu koymak cazip oldu. Sürdürülebilirlik hemen üretkenlik için feda edildi. Komut dosyalarının kaldırılması ve sabit bir şablon yapı kümesiyle sınırlandırılması, sürdürülebilirliği etkili bir şekilde güçlendirmenin bir yoluydu. JS dünyasında böyle bir bozulma yok.
JSP ve Java sözdizimi,
<% ... %>Java kodunu öğe oluşturma işleminden ayırmak için fazladan ve Java'nın birforeachkavram veya birinci sınıf işlevlerden yoksun olan yerel sözdizimiyle (yakın zamana kadar) tıknazdır. JSX'teki döngüler ve koşullu için yerel Javascript kullanmanın sözdizimi cezası sıfır değildir (bence) ama JSP kadar kötü değildir ve muhtemelen döngüler ve koşullu için JSX'e özgü öğelerin tanıtılmasını gerektirecek kadar kötü değildir.
Özlediğim başka bir şey var mı?