CODEWITHSUNDEEP
javascriptreactjs
Jack23
Jack23

Reputation: 1396

Insert element inside array

I have a function

checkName(output) {

  output.filter((NewData) => {
    return this.props.elements.filter((OldData) => {
      if (NewData.key == OldData.key) {
        NewData.name = OldData.name,
          //there i need to add another element 
          // Need to add newData.number = OldData.number
      }
      return NewData
    })
  })
  
  return output
}

and I call this function like:

const named = this.checkName(product.rows)

Now I need to add to my product's array that I passed to checkName the value "OldData.Number" to "newData.Number" that is not defined in product (so I need to create this field)

For example:

Product before the checkName function

product.rows = [NewData.name]

Product after the checkName function

product.rows = [NewData.name="value of OldData.name", NewData.number="value of OldData.number"]

How can I obtain this result?

Upvotes: 0

Views: 73

Answers (3)

Tao Gómez Gil
Tao Gómez Gil

Reputation: 2695

There are 2 confusing things in your code:

  • You are using filter to execute an action in each member of the output array. However, filter should be used to... well, filter that array, meaning that is should not modify it, just return a sub-set of it. Instead, you might want to use forEach. However, taking into accound the next bullet, probably you want to use map.
  • You are modifying the array passed to the checkName function. This is confusing and can lead to hard-to-find bugs. Instead, make your function "pure", meaning that it should not mutate its inputs, instead just return the data you need from it.

I would suggest some implementation like this one:

checkName(output){
    return output.map((NewData) => {
        // find the old data item corresponding to the current NewData
        const OldData = this.props.elements.find(x => x.key === NewData.key);
    
        if (OldData) {
            // If found, return a clone of the new data with the old data name
        
            // This uses the spread syntax: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax
            return {
                ...NewData, // Clone the NewData object
                name: OldData.name, // set the value found in OldData.name in the "name" field of the cloned object
                number: OldData.number, // You can do the same for each field for which you want to replace the value cloned from NewValue
            };
        } else {
            // Otherwise, just return a clone of the NewData
            return { ...NewData };
        }
    }
}

The usage would be like this:

const named = this.checkName(product.rows)

Be aware that the product.rows array won't be modified!

Upvotes: 1

Manikandan Velayutham
Manikandan Velayutham

Reputation: 2228

Use map like this.

checkName(output){
return output.map(( NewData) =>{
 this.props.elements.forEach((OldData) => {
 if (NewData.key == OldData.key) {
     NewData.name = OldData.name;
     NewData.number = OldData.number;
   }
})
 return NewData;
})
 // return output;
}

Upvotes: 0

OlivDev
OlivDev

Reputation: 1

You can get keys and values of the old object.

const keys = Object.keys(oldObject);
const values = Object.values(oldObject);

// or
const [keys, values] = Object.entries(oldObject);

After, you will create a loop with all keys of oldObject, and insert in newObject like a array.

keys.forEach( (key, index) => newObject[key] = values[index]);

// or

for (const [key, value] of Object.entries(object1)) {
  newObject[key] = value
}

Upvotes: 0

Related Questions