Мапа је тип прикупљања података где се подаци чувају у облику парова. Садржи јединствени кључ. Вредност сачувана у мапи мора бити пресликана на кључ. Не можемо да сачувамо дупли пар у мапи(). То је због јединствености сваког сачуваног кључа. Углавном се користи за брзо претраживање и тражење података.
У Реацт-у, ?мапа? метод који се користи за прелазак и приказ листе сличних објеката компоненте. Мапа није карактеристика Реацт-а. Уместо тога, то је стандардна ЈаваСцрипт функција која се може позвати на било ком низу. Метода мап() креира нови низ позивањем обезбеђене функције за сваки елемент у низу који позива.
Пример
У датом примеру, функција мап() узима низ бројева и удвостручује њихове вредности. Додељујемо нови низ који враћа мап() променљивој доублеВалуе и евидентирамо га.
var numbers = [1, 2, 3, 4, 5]; const doubleValue = numbers.map((number)=>{ return (number * 2); }); console.log(doubleValue); У Реацт-у, метода мап() која се користи за:
1. Прелазак преко елемента листе.
Пример
import React from 'react'; import ReactDOM from 'react-dom'; function NameList(props) { const myLists = props.myLists; const listItems = myLists.map((myList) => <li>{myList}</li> ); return ( <h2>React Map Example</h2> <ul>{listItems}</ul> ); } const myLists = ['A', 'B', 'C', 'D', 'D']; ReactDOM.render( , document.getElementById('app') ); export default App; Излаз
2. Прелазак преко елемента листе помоћу тастера.
Пример
import React from 'react'; import ReactDOM from 'react-dom'; function ListItem(props) { return <li>{props.value}</li>; } function NumberList(props) { const numbers = props.numbers; const listItems = numbers.map((number) => ); return ( <h2>React Map Example</h2> <ul> {listItems} </ul> ); } const numbers = [1, 2, 3, 4, 5]; ReactDOM.render( , document.getElementById('app') ); export default App; Излаз
