title: Why is JavaScript object value are change when I push another value in array?
body: <p>Here is my code:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var arr = [];
  var obj = {};
  
  (function() {
    for(let i = 1; i &lt;= 10; i++) {
      arr.push(i);
      obj[i] = arr;
    }
  })();</code></pre>
  </div>
  </div>
  </p>
  
  <p>This code gave me this output: </p>
  
  <pre><code>{
    '1': [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ],
    '2': [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ],
    '3': [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ],
    '4': [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ],
    '5': [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ],
    '6': [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ],
    '7': [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ],
    '8': [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ],
    '9': [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ],
    '10': [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ] 
  }
  </code></pre>
  
  <p>Why doesn't it give an output like this?</p>
  
  <pre><code>{
    '1': [ 1 ], 
    '2': [ 1, 2 ], 
    '3': [ 1, 2, 3 ], 
    '4': [ 1, 2, 3, 4 ], 
    '5': [ 1, 2, 3, 4, 5 ], 
    '6': [ 1, 2, 3, 4, 5, 6 ], 
    '7': [ 1, 2, 3, 4, 5, 6, 7 ], 
    '8': [ 1, 2, 3, 4, 5, 6, 7, 8 ], 
    '9': [ 1, 2, 3, 4, 5, 6, 7, 8, 9 ], 
    '10': [ 1, 2, 3, 4, 5, 6, 7, 8, 9, 10 ]
  }
  </code></pre>