Impossible to edit returned result of web3 call() method

Question

I'm trying to edit returned result from web3.js but getting the error:

TypeError: Cannot assign to read only property 'fixtureId' of object '[object Array]'

My react js code:

let event = new web3.eth.Contract(Events.abi, Events.networks[networkId].address);
let result = event.methods.getFixtures(date).call();
result[0].fixtureId = 10; <- here it throws me an error

As I understand, call() method returns an immutable object. But is it possible to make it return a mutable object?

Plus, it returns strange object like:

0: "1"
1: "some event"
2: "868008"
status: "1"
title: "some event"
fixtureId: "868008"

Answer 1

You cannot make the call() method to return a mutable object - it's designed to be read-only that retrieves data from the blockchain. You get an immutable object, so you can't modify its properties directly.

You can create a copy of the object and modify the copy instead. You can f.e. use the spread operator (...) like that:

let modifiedResult = [...result];
modifiedResult[0].fixtureId = 10;

To fix the part with the strange object - looks like an array of strings. You can convert it to an array of objects like this:

let convertedResult = result.map((item) => {
  return {
    fixtureId: item[2],
    title: item[1],
    status: item[0],
  };
});