title: Get key and value separately with array.map function - ReactJS - TypeScript
body: <p>I am doing my best to fetch my data separately and use it in my JSX, but it seems that I am doing something wrong.</p>
  <p>As an example a retrieve from the BE an array that looks like this :</p>
  <pre><code>const myArr = [ 
     { 
      A: &quot;Ananas&quot;, 
      B: &quot;Banana&quot;, 
      C: &quot;Citroen&quot;
     }
  ]
  </code></pre>
  <p>And my ultimate goal is to map over it and use it into my JSX like this:</p>
  <pre><code>...
   &lt;Select onChange={(e: any) =&gt; handleChange(e)}&gt;
      {myArr.map((key,value) =&gt; ( 
         &lt;MenuItem key={key} value={value}&gt;{value}&lt;/MenuItem&gt;
      ))}
   &lt;/Select&gt;
  ...
  </code></pre>
  <p>Behind the scenes I prefer to look something like this :</p>
  <pre><code>&lt;MenuItem key=&quot;A&quot; &gt;Ananas&lt;/MenuItem&gt;
  &lt;MenuItem key=&quot;B&quot; &gt;Banana&lt;/MenuItem&gt;
  &lt;MenuItem key=&quot;C&quot; &gt;Citroen&lt;/MenuItem&gt;
  </code></pre>
  <p>But it seems that somewhere along the way I got lost. If someone can give me a hand I would be very grateful. Cheers !</p>