title: Mutate string originating from React state
body: <p>Let's say for some delicate reason I have the following react state:</p>
  
  <pre><code>{ superGreeting: 'Hello!!!' }
  </code></pre>
  
  <p>Now, assume I have this complicated operation that basically takes the superGreeting string and works on it, in the end replacing a character at a specific position. New state then should be:</p>
  
  <pre><code>{ superGreeting: 'Hullo!!!' }
  </code></pre>
  
  <p>So, there would be my action:</p>
  
  <pre><code>action = (index) =&gt; {
    var { superGreeting: newGreeting } = this.state;
    newGreeting[index] = 'u';
    this.setState({superGreeting: newGreeting});
  }
  </code></pre>
  
  <p>Unfortunatelly, such approach does not work and ends with:
  <code>TypeError: Cannot assign to read only property '1' of string 'Hello!!!'</code>, indicating this line as the offending one: <code>newGreeting[index] = 'u'</code></p>
  
  <p>I use react.js, ES6, no redux, no mobx, no immutable.js. Thought that the issue is caused by the string still being related/used by the soon-to-be-previous state, so I thought that creating a copy would work (I tried <code>newGreeting = newGreeting.toString()</code>, <code>'' + newGreeting</code>, `${newGreeting}`, <code>''.concat(newGreeting)</code>, without any success). Any ideas?</p>