1render: function() {
2  const elements = ['one', 'two', 'three'];
3  return (
4    <ul>
5      {elements.map((value, index) => {
6        return <li key={index}>{value}</li>
7      })}
8    </ul>
9  )
10}
11

1const brandGroups = brandNames.map((e, i) => {
2      return i % chunkSize === 0 ? brandNames.slice(i, i + chunkSize) : null;
3    }).filter(e => { return e; });
4
5    const renderBrandsItems = () => {
6      const ThreePlusBrands = `${brandNames.slice(0, 3).join(", ")} + ${brandNames.length - 3} more`;
7      if (brandGroups.length <= 3) {
8        return brandGroups.map((item, i) => {
9          return (
10            <div key={i}>
11              <SelectionLabel>
12                {item}
13                <ClearIcon
14                  className="fa fa-times"
15                  data-name={item}
16                  onClick={handleBrandClick}
17                />
18              </SelectionLabel>
19            </div>
20          );
21        });
22      }
23      return (
24        <SelectionLabel>
25          {ThreePlusBrands}
26          <ClearIcon className="fa fa-times" onClick={onClearBrands} />
27        </SelectionLabel>
28      );
29    };

1<tbody>
2  {[...Array(10)].map((x, i) =>
3    <ObjectRow key={i} />
4  )}
5</tbody>
6

1{data.map(x => {
2  return (
3    <div>
4      <p>{content}</p>
5    </div>
6  )
7})}

1this.items = this.state.cart.map((item, key) =>    <li key={item.id}>{item.name}</li>);

1import React from 'react';
2import './App.css';
3
4
5let items=['Item 1','Item 2','Item 3','Item 4','Item 5'];
6let itemList=[];
7items.forEach((item,index)=>{
8  itemList.push( <li key={index}>{item}</li>)
9})
10function App() {
11  
12  return (
13    <>
14   
15      <h2>This is a simple list of items</h2>
16      <ul>
17        {itemList}
18      </ul>
19    </>
20  );
21}
22
23export default App;
24