How to update key values behalf of Id's [duplicate]-CodePudding

I have these JavaScript objects

var oldObject=[{ 
            id:1,
            key:'name', 
            fiendSize:'6', 
            fromPlaceHolder:'', 
            fieldInstruction:'',
            filedType:'input', 
            lable:"Single Line ", 
            type:'text', 
            formValidation: {
                required:false
            }
        }];


var newObject=  { 
            id:1,
            key:'name', 
            fiendSize:'12', 
            fromPlaceHolder:'Enter Your Name', 
            fieldInstruction:'please Enter string only',
            filedType:'input', 
            lable:"Single Line ", 
            type:'text', 
            formValidation: {
                required:true
            }
        };

I need to replace/update the oldObject value with newObject value from with the same id.

So here is the result I want to get:

var oldObject = [{ 
            id:1,
            key:'name', 
            fiendSize:'12', 
            fromPlaceHolder:'Enter Your Name', 
            fieldInstruction:'please Enter string only',
            filedType:'input', 
            lable:"Single Line ", 
            type:'text', 
            formValidation: {
                required:true
            }]

How can I implement it using JavaScript in react js ?

CodePudding user response：

You can use Object.entries() like:

var oldObject = [{
  id: 1,
  key: 'name',
  fiendSize: '6',
  fromPlaceHolder: '',
  fieldInstruction: '',
  filedType: 'input',
  lable: "Single Line ",
  type: 'text',
  formValidation: {
    required: false
  }
}];


var newObject = {
  id: 1,
  key: 'name',
  fiendSize: '12',
  fromPlaceHolder: 'Enter Your Name',
  fieldInstruction: 'please Enter string only',
  filedType: 'input',
  lable: "Single Line ",
  type: 'text',
  formValidation: {
    required: true
  }
};

let result = [{}];
for (const [key, value] of Object.entries(oldObject[0])) {
  result[0][key] = newObject[key];
}
console.log(result);

Reference:

Object.entries()

P.S. i used new object but you can update the old object and i hardcoded the array number so if you have more then 1 you need to use for-loop.

CodePudding user response：

Using Array.map and merge 2 object by {...existItem, ...newObject}.

var oldObject = [{
  id: 1,
  key: 'name',
  fiendSize: '6',
  fromPlaceHolder: '',
  fieldInstruction: '',
  filedType: 'input',
  lable: "Single Line ",
  type: 'text',
  formValidation: {
    required: false
  }
}];

var newObject = {
  id: 1,
  key: 'name',
  fiendSize: '12',
  fromPlaceHolder: 'Enter Your Name',
  fieldInstruction: 'please Enter string only',
  filedType: 'input',
  lable: "Single Line ",
  type: 'text',
  formValidation: {
    required: true
  }
};

var result = oldObject.map(item => {
   var existItem = oldObject.find(e => e.id == newObject.id);
   if (existItem) {
      return {...existItem, ...newObject};
   }
   return item;
});

console.log(result);

CodePudding user response：

var oldObject = [{
  id: 1,
  key: 'name',
  fiendSize: '6',
  fromPlaceHolder: '',
  fieldInstruction: '',
  filedType: 'input',
  lable: "Single Line ",
  type: 'text',
  formValidation: {
    required: false
  }
}];


var newObject = {
  id: 1,
  key: 'name',
  fiendSize: '12',
  fromPlaceHolder: 'Enter Your Name',
  fieldInstruction: 'please Enter string only',
  filedType: 'input',
  lable: "Single Line ",
  type: 'text',
  formValidation: {
    required: true
  }
};


const findByIdWithIndex = oldObject.findIndex(d => d.id === newObject.id)

if (findByIdWithIndex !== -1) {
  // Found the Old object id Matching with new object id
  oldObject[findByIdWithIndex] = { ...newObject
  }
}

console.log("Updated oldObject :", oldObject)

Update the Index found with new object Id to old Object Id's index and replace it.

CodePudding user response：

Since this is React you should be looking towards immutable data structures.

filter out the objects that don't match the id, and then add in the updated object.

const arr = [
  { id: 1, name: 1 },
  { id: 2, name: 2 },
  { id: 3, name: 3 }
];

const newArr = [
  ...arr.filter(obj => obj.id !== 2),
  { id: 2, name: 'Billy Joel' }
];

console.log(newArr);

Additional documentation

Spread syntax