Javascript: forEach() loop to populate an array - closure issue
<p>Let's say we have an array of objects like:</p>

<pre><code>var fruits = [ {name:"banana", weight:150},{name:"apple", weight:95},{name:"orange", weight:160},{name:"kiwi", weight:80} ];
</code></pre>

<p>I want to populate a "heavy_fruits" array with items from the "fruits" array above which weight is > 100. Here is my code:</p>

<pre><code>var heavy_fruits = [];
myfruit = {};

fruits.forEach(function(item,index) {
  if ( item.weight &gt; 100 ) { 
    myfruit ["name"] = item.name;
    myfruit ["weight"] = item.weight;
  }

heavy_fruits.push(myfruit);
});
</code></pre>

<p>However it shows:
    name:"orange", weight:160
    name:"orange", weight:160
    name:"orange", weight:160
    name:"orange", weight:160 </p>

<p>I know this is an issue with mixing closures and loops... but I read an article (<a href="http://zsoltfabok.com/blog/2012/08/javascript-foreach/" rel="noreferrer">http://zsoltfabok.com/blog/2012/08/javascript-foreach/</a>) explaining that I would avoid this kind of issue using a forEach loop instead of the classic for loop.</p>

<p>I know I can use array methods like filter(), etc. but I'm asking that on purpose since I'm actually having troubles with a much bigger function that I cannot expose here... So I tried to summarize and simplify my issue description with "fruits".</p>