React.js предоставляет JSX в виде XHTML-подобного синтаксиса для построения дерева компонентов и элементов. JSX компилируется в Javascript, и вместо предоставления циклов или условных выражений в собственно JSX вы используете Javascript напрямую:
<ul>
{list.map((item) =>
<li>{item}</li>
)}
</ul>Что я еще не смог объяснить, так это почему это считается хорошим, если аналогичные конструкции считаются плохими в JSP?
Как то так в JSP
<ul>
<% for (item in list) { %>
<li>${item}</li>
<% } %>
</ul>считается проблема читабельности, которая решается с помощью тегов, таких как <c:forEach>. Причины, по которым теги JSTL также могут быть применимы к JSX:
- это немного легче читать, когда вы не переключаетесь между XHTML-подобным синтаксисом (угловые скобки, вложение) и Java / Javascript (curlies, запятые, parens)
- когда у вас есть полный язык и платформа, доступные для использования внутри функции рендеринга, есть меньше, чтобы отговорить вас от использования логики, которой там не место.
Единственные причины, по которым я могу думать, почему JSX отличается:
в Java у вас был стимул сделать что-то не то - JSP был бы перегружен, поэтому было заманчиво поместить код в JSP, чтобы избежать цикла перестроения / перезапуска. Ремонтопригодность была принесена в жертву для немедленной производительности. Изгнание скриптлетов и ограничение фиксированного набора шаблонных конструкций было эффективным способом обеспечения возможности сопровождения. В мире JS такого искажения не существует.
Синтаксис JSP и Java не совсем удобен,
<% ... %>чтобы отличать Java-код от генерации элементов, а в родном синтаксисе Java отсутствуетforeachконцепция или первоклассные функции (до недавнего времени). Синтаксическое наказание за использование нативного Javascript для циклов и условных выражений в JSX является ненулевым (на мой взгляд), но не таким плохим, как JSP, и, возможно, не настолько плохим, чтобы оправдать введение специфичных для JSX элементов для циклов и условных выражений.
Что-то еще мне не хватает?