How to Use Array Map Function in React.js

Map is a collection of elements where each element is stored as a key, value pair. Map object can hold both objects and primitive values as either key or value. It’s like PHP’s foreach loop.

Let’s try to render an array using map function in React app:

App.js
import React from 'react';

function App() {
  const array = ['1', '2', '3', '4', '5'];

  return(
    <ul>
      {array.map((value, index) => {
        return <li key={index}>{value}</li>
      })}
    </ul>
  )
}

export default App;
That’s it. Thanks for reading. ?

Software Engineer | Ethical Hacker & Cybersecurity...

Md Obydullah is a software engineer and full stack developer specialist at Laravel, Django, Vue.js, Node.js, Android, Linux Server, and Ethichal Hacking.