why foreach over writing the value instead of return all values

Question

following is an array that needed to be store on local storage when the dom is created.

  this.headers.push( 
   {
      text: "Name",
      align: "center",
      sortable: true,
      value: "name",
      align: "start",
    },
    {
      text: "Company",
      align: "center",
      sortable: true,
      value: "company",
      align: "start",
    },
    {
      text: "Phone",
      align: "center",
      sortable: true,
      value: "phone",
      align: "start",
    },
   )]

the value of each object needed to be store on localstorage under the key name el_columns. so I have tried as follows.

   this.headersList.forEach((element) => {
      localStorage.setItem(
        "el_columns",
        JSON.stringify(element.value)
      );
    });

the above code works fine but is stores only one value which is the last object value phone. the output i expect is like follows ['name', 'company', 'phone']

It is not storing one value, but over writing previous stored value. — Alaksandar Jesus Gene, May 21 '21 at 15:54
Use `map` to get an array of `value`s. No need for forEach: `JSON.stringify(this.headers.map(h => h.value))` — adiga, May 21 '21 at 15:59

score 1 · Accepted Answer · answered May 21 '21 at 15:56

1

Try this

 this.headersList.forEach((element) => {
      localStorage.setItem(
        "el_columns_"+element.text,
        JSON.stringify(element.value)
      );
    });

answered May 21 '21 at 15:56

Alaksandar Jesus Gene

6,523
12
52
83

NOT SOLVED. it creates seperate key values as for each object. – Mohamed Raza May 21 '21 at 15:59
Try localStorage.setItem("el_columns_", JSON.stringify(this.headers)); – Alaksandar Jesus Gene May 21 '21 at 16:03
` let result = obj.map((col) => col.value);` this is the working code i found – Mohamed Raza May 21 '21 at 16:05

why foreach over writing the value instead of return all values

1 Answers1