<section id="description">
В предыдущих задачах вы узнали, как выводить код JavaScript в код JSX, используя фигурные скобки, <code>{ }</code>, например, в таких задачах, как доступ к свойствам, передача свойств, доступ к состоянию, вставка комментариев в ваш код и дизайн ваших компонентов. Это все распространенные случаи использования JavaScript в JSX, но это не единственный способ использования кода JavaScript в компонентах React. Вы также можете писать JavaScript непосредственно в своих методах <code>render</code> перед оператором <code>return</code> , не вставляя его внутри фигурных скобок. Это связано с тем, что он еще не находится в коде JSX. Если вы хотите использовать переменную позже в коде JSX внутри оператора <code>return</code> , вы поместите имя переменной внутри фигурных скобок.

 Примечание: JSX существует не только в рамках выполнения оператора <code>return</code>. Вообще <code>return</code> тут ничего не определяет более того, как только возврат значения. Границы JSX определяются тегами, написанными с использованием угловых скобок <code>&#x3C;</code> и <code>></code>, так же, как теги пишутся в HTML. Для примера:
 <pre class="language-jsx"><code>const string = "Some string value";
const content = &#x3C;div>String: {string}&#x3C;/div>
return content;</code></pre>

Здесь константа <code>content</code> содержит в себе JSX-элемент, и чтобы внутри него вывести значение константы <code>string</code>, пришлось использовать фигурные скобки. В противном случае мы бы получили не значение константы, а простой текст <code>string</code>. То есть расценивайте JSX как шаблонизатор (коих много). Так будет проще и понятней.
</section>

Use Advanced JavaScript in React Render Method

front-end-libraries

React

До того как мы нажали на кнопку, значение randomIndex равен пустой строке, а это значит const answer = possibleAnswers[""];   Почему в данном случае мы не получаем ошибку?  Как вычислятся значение {answer} в JSX до нажатия на кнопку?

Обсуждение задания "Use Advanced JavaScript in React Render Method"