title: ES6 map function for tuples/2d arrays
body: <p>I'm trying to write a map function to return a navbar.
  I have an array/dictionary that I want to loop through using the map function that looks something like</p>
  
  <pre><code>[['Text', './link.html'],
   ['Text2', './link2.html'],
   ['Text3', './link3.html']]
  </code></pre>
  
  <p>or else</p>
  
  <pre><code>{'Text', './link.html',
   'Text2', './link2.html',
   'Text3', './link3.html'}
  </code></pre>
  
  <p>Whatever type I need to loop through doesn't matter, I just want to loop through sets of 2, ideally I'd want to use tuples, but it doesn't look like that's an option from what I've read.</p>
  
  <p>When looking at solutions that use the <a href="https://stackoverflow.com/questions/14810506/map-function-for-objects-instead-of-arrays">dict/object method</a>, I don't know how to access both the key and the value. For ex.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="true" data-console="false" data-babel="false">
  <div class="snippet-code snippet-currently-hidden">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var NavBar = (props) =&gt; {
  
      return (
          &lt;div id="NavMain"&gt;
              {Object.keys(props.links).map((link,index) =&gt; {
                  return &lt;NavBarItem link={link} /&gt;
                  {/* Where do I access the key? */}
              })}
          &lt;/div&gt;
      )}</code></pre>
  </div>
  </div>
  </p>
  
  <p>If I try to map this as a 2d array, my IDE is showing some error lines underneath 'row', 'text' and '/>' in the code below</p>
  
  <p><div class="snippet" data-lang="js" data-hide="true" data-console="false" data-babel="false">
  <div class="snippet-code snippet-currently-hidden">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var NavBar = () =&gt; {
        
      return (
          &lt;div id="NavMain"&gt;
              {this.props.links.map((row,index) =&gt; {
                  return &lt;NavBarItem link=row[1] text=row[0] /&gt;
              })}
          &lt;/div&gt;
      )}</code></pre>
  </div>
  </div>
  </p>
  
  <p>Other solutions I've looked up are really messy. I'm wondering if there's a clean way to use the map function over sets of 2.</p>