title: How to Overwrite a File Object value?
body: <p>I have a  function, which essentially takes a File Object from an array, and duplicates it with a few adjustments:</p>
  
  <p><code>i</code> is the array index</p>
  
  <pre><code>  duplicate(i) {
      const arr = [...this.state.files];
      console.log(arr[i].color) //red
  
      let name = arr[i].name.slice(0, -4);
      name = `${name}-${Math.floor(Math.random() * 1000) + 1}.png`;
  
      const newFile = new File([""],name)
      const index = i + 1;
  
      arr.splice(index, 0, newFile)
      arr[i+1].id = Math.random().toString(32);
      arr[i+1].color = arr[i].color //set the color to red
      arr[i+1].preview = arr[i].preview;
      console.log(arr[i+1]) //color in arr is now black (the default color)
      this.setState({
        files: arr
      })
    }
  </code></pre>
  
  <p>What is happening is that the File Object gets recreated into the array, and then I successfully give it a new name, an id and a preview value.</p>
  
  <p>I attempt to assign the color value, but this fails because color is already a value in the object.</p>
  
  <p>How do I overwrite the existing value?</p>