title: why foreach over writing the value instead of return all values
body: <p>following is an array that needed to be store on local storage when the dom is created.</p>
  <pre><code>  this.headers.push( 
     {
        text: &quot;Name&quot;,
        align: &quot;center&quot;,
        sortable: true,
        value: &quot;name&quot;,
        align: &quot;start&quot;,
      },
      {
        text: &quot;Company&quot;,
        align: &quot;center&quot;,
        sortable: true,
        value: &quot;company&quot;,
        align: &quot;start&quot;,
      },
      {
        text: &quot;Phone&quot;,
        align: &quot;center&quot;,
        sortable: true,
        value: &quot;phone&quot;,
        align: &quot;start&quot;,
      },
     )]
  </code></pre>
  <p>the value of each object needed to be store on localstorage under the key name <code>el_columns</code>. so I have tried as follows.</p>
  <pre><code>   this.headersList.forEach((element) =&gt; {
        localStorage.setItem(
          &quot;el_columns&quot;,
          JSON.stringify(element.value)
        );
      });
  </code></pre>
  <p>the above code works fine but is stores only one value which is the last object value <code>phone</code>. the output i expect is like follows <code>['name', 'company', 'phone']</code></p>