Loop through arrays in ReactJs

.map is ES6 feature and used with array; it returns a new array with the results of calling a function for every array element.

'key' attribute is used to uniquely identify elements.

Example:

import React from 'react';

const names = ['John', 'Doe', 'Jenny', 'Marie'];

function App() {

  return (

    <div className="App">

      <ul>

          {names.map(function(name, index){

              return <li key={ index }>{name}</li>;

          })}

      </ul>

    </div>

  );

}

export default App;

Result: