# Формирование тегов из массива с данными в React

Пусть у нас есть какой-нибудь массив с некими данными, например, вот такой:

`function App() { const arr = [1, 2, 3, 4, 5]; }`

Давайте положим каждый элемент этого массива в абзац и выведем эти абзацы в диве. Для этого мы можем воспользоваться любым удобным циклом JavaScript. Например, обычным `for-of`:

`function App() { const arr = [1, 2, 3, 4, 5]; const res = []; for (const elem of arr) { res.push(<p>{elem}</p>); } return <div> {res} </div>; }`

Однако, в React для таких дел более принято использовать метод `map`:

`function App() { const arr = [1, 2, 3, 4, 5]; const res = arr.map(function(item) { return <p>{item}</p>; }); return <div> {res} </div>; }`

Дан массив:

`function App() { const arr = ['a', 'b', 'c', 'd', 'e']; }`

С помощью этого массива сформируйте следующий код:

`<ul> <li>a</li> <li>b</li> <li>c</li> <li>d</li> <li>e</li> </ul>`
← →
↑