Mapa je typ zberu údajov, kde sú údaje uložené vo forme párov. Obsahuje jedinečný kľúč. Hodnota uložená v mape musí byť namapovaná na kľúč. Do map() nemôžeme uložiť duplicitný pár. Je to kvôli jedinečnosti každého uloženého kľúča. Používa sa hlavne na rýchle vyhľadávanie a vyhľadávanie údajov.

V React sa ?mapa? metóda používaná na prechádzanie a zobrazenie zoznamu podobných objektov komponentu. Mapa nie je funkciou Reactu. Namiesto toho je to štandardná funkcia JavaScript, ktorú možno volať na ľubovoľné pole. Metóda map() vytvorí nové pole volaním poskytnutej funkcie na každom prvku vo volajúcom poli.

Príklad

V uvedenom príklade funkcia map() berie pole čísel a zdvojnásobuje ich hodnoty. Nové pole vrátené pomocou map() priradíme premennej doubleValue a zaprotokolujeme.

numpy linspace

 var numbers = [1, 2, 3, 4, 5]; const doubleValue = numbers.map((number)=>{ return (number * 2); }); console.log(doubleValue); 

V Reacte sa metóda map() používa na:

1. Prechádzanie prvkom zoznamu.

Príklad

 import React from &apos;react&apos;; import ReactDOM from &apos;react-dom&apos;; function NameList(props) { const myLists = props.myLists; const listItems = myLists.map((myList) =&gt; <li>{myList}</li> ); return ( <h2>React Map Example</h2> <ul>{listItems}</ul> ); } const myLists = [&apos;A&apos;, &apos;B&apos;, &apos;C&apos;, &apos;D&apos;, &apos;D&apos;]; ReactDOM.render( , document.getElementById(&apos;app&apos;) ); export default App; 

Výkon

2. Prechádzanie prvkom zoznamu pomocou kláves.

Príklad

 import React from &apos;react&apos;; import ReactDOM from &apos;react-dom&apos;; function ListItem(props) { return <li>{props.value}</li>; } function NumberList(props) { const numbers = props.numbers; const listItems = numbers.map((number) =&gt; ); return ( <h2>React Map Example</h2> <ul> {listItems} </ul> ); } const numbers = [1, 2, 3, 4, 5]; ReactDOM.render( , document.getElementById(&apos;app&apos;) ); export default App; 

Výkon