title: Invalid attempt to spread non-iterable instance on an object
body: <pre><code> data: [],
  
   ... 
  </code></pre>
  
  <p>I load data from API call into <code>data</code> array. Then I try to arrange the data array into a map which can consist of a key, value pairs (value can be itself array) using below. </p>
  
  <pre><code>    const dataMap = {};
      for (let i = 0; i &lt; data.length; i+=1) {
        const key = data[i].product.name;
        const value = data[i];
  
        if (key in dataMap) {
          dataMap[key].push(value);
        } else {
          dataMap[key] = [value];
        }
      }
  </code></pre>
  
  <p>But when I do the following I get the following error. What I am doing wrong? </p>
  
  <pre><code>{[...dataMap].map(([key, value]) =&gt; {}
  </code></pre>
  
  <blockquote>
    <p>Invalid attempt to spread non-iterable instance</p>
  </blockquote>
  
  <p><strong>This is my dataMap</strong>
  <a href="https://i.stack.imgur.com/BouBW.png" rel="noreferrer"><img src="https://i.stack.imgur.com/BouBW.png" alt="enter image description here"></a></p>
  
  <p>DataMap is correctly calculate but when i iterate using the following code</p>
  
  <pre><code>Object.entries(dataMap).map((key, value) =&gt; {
            console.log(key);
            console.log(value)
   })
  </code></pre>
  
  <p>it prints out the following. Value is some index which i dont understand why ? Value should be an array. My dataMap is a key, value (value is an array)</p>
  
  <p><a href="https://i.stack.imgur.com/DP74z.png" rel="noreferrer"><img src="https://i.stack.imgur.com/DP74z.png" alt="enter image description here"></a></p>