When retrieving an array of objects from an RX/JS call through an http backend, I encounter a peculiar issue. After making modifications to the object within a loop (attempting different methods like .forEach), the values seem to change temporarily but revert back unexpectedly.
For instance, after setting correctionQueued to true in the loop, accessing array[index] immediately afterward shows correctionQueued as false. Strangely, a new property like correctionStatus is added successfully despite not existing in the original object.
Despite attempting various looping techniques and even working on copies of the object, preexisting properties remain unchanged while new properties are added without issues.
checklistCopy.forEach((checklistItem, index, array) => {
if (checklistItem.crCode.isirName === correctionSetItem) {
array[index].correctionQueued = true;
array[index].correctionValue = mostRecentCorrection.correctionValue;
array[index].correctionStatus = mostRecentCorrection.status;
console.log(array[index].correctionQueued, array[index].correctionValue, array[index].correctionStatus);
console.log(array[index]);
}
});
Although there are no errors thrown, the behavior observed is puzzling.
Initial object:
correctionQueued: false;
correctionValue: JAAMES;
--
console.log(array[index].correctionQueued, array[index].correctionValue, array[index].correctionStatus);
true JAMES SENT
However, when outputting the entire object:
console.log(array[index]);
correctionQueued: false;
correctionValue: JAAMES;
correctionStatus: "SENT'; <-- This is set correctly but does not exist on original object.