Update objects within an array

Question

Original array (form[id].values.sections) made up of different objects

(3) [{…}, {…}, {…}]
    1. 0: 
        1. attachments: Array(0)
            1. length: 0
            2. [[Prototype]]: Array(0)
        2. body: "" // How do i update the values here without the original array being converted into an object
        3. [[Prototype]]: Object
    2. 1: {body: '', attachments: Array(0)}
    3. 2: {body: '', attachments: Array(0)}
    4. length: 3
    5. [[Prototype]]: Array(0)

If i use the following method to update body, it turns into an object as shown below

        updatedSections = {
          ...form[id].values.sections,
          0: {
            body: contentBody, attachments: form[id].values.sections[0].attachments,
          },
        };

updatedSection becomes an object.

{0: {…}, 1: {…}, 2: {…}}
    1. 0: 
        1. attachments: Array(0)
            1. length: 0
            2. [[Prototype]]: Array(0)
        2. body: "<p>Content update here</p>"
        3. [[Prototype]]: Object
    2. 1: {body: '', attachments: Array(0)}
    3. 2: {body: '', attachments: Array(0)}
[[Prototype]]: Object

btw what browser outputs those numbers before all the properties? It makes it really hard to see their names... — Nick
– Nick, Commented Oct 17, 2022 at 2:19
Body is actually a string but if i update it using the method shown, it will convert the original array into an object. I'm using chrome. — user8779054
– user8779054, Commented Oct 17, 2022 at 2:21

Nick · Accepted Answer · 2022-10-17 02:29:20Z

1

You've converted your array into an object by using

updatedSections = { ... }

If you want it to remain an array, you need to use array notation e.g.

updatedSections = [
  {
     body: contentBody, 
     attachments: form[id].values.sections[0].attachments,
  },
  ...form[id].values.sections.slice(1)
]

answered Oct 17, 2022 at 2:29

Nick

147k23 gold badges67 silver badges106 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

user8779054 Over a year ago

May i ask if we need to update the second and third array as well, would it work?

Nick Over a year ago

@user8779054 you mean the second and third values in the array? You could still use something similar, and use slices to get the non-updated values, but then it might be simpler to just use updatedSections = form[id].values.sections and then individually update the elements using for example updatedSections[0] = { body: contentBody, attachments: form[id].values.sections[0].attachments, }

Haritha Senevirathne · Accepted Answer · 2022-10-17 02:53:03Z

1

Yes it becomes an object. Because updatedSections is an object. (you have initialize it with {}).

  updatedSections = { // <-- here
      ...form[id].values.sections,
      0: {
        body: contentBody, attachments: form[id].values.sections[0].attachments,
      },
    }; // <-- here

Below is the correct way to access body property in the array.

form[id].values.sections[0].body = <your_new_content>;

If you don't want to update the original array directly, make a copy of the sections array and update the desired properties in it. Hope this makes sense.

edited Oct 17, 2022 at 2:53

answered Oct 17, 2022 at 2:29

Haritha Senevirathne

1951 silver badge7 bronze badges

Collectives™ on Stack Overflow

Update objects within an array

2 Answers 2

2 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related