title: Remove element of an object from array of objects - react state
body: <p>I have an array of objects stored in state using React</p>
  
  <pre><code>this.state= {
    people: [
      {
        name: 'Tom',
        hobbies: ['dancing', 'swimming']
      }, {
        name: 'Dean',
        hobbies: ['playing', 'wondering']
      }, {
        name: 'Jack',
        hobbies: ['shooting', 'hiking']
      }, {
        name: 'Natalie',
        hobbies: ['rock', 'cats']
      }
    ]
  };
  </code></pre>
  
  <p>I want to update the state by removing one specific element from hobbies.
  I tried to copy people array from state, then iterate through every person object then through every hobbies array to then check if the element is the one I want to remove, but I didn't manage to remove it, state was not changing.
  The thing I tried was to map it and afterwards filter.</p>
  
  <p>What is the easiest and fastest way to do it?
  I just started learning React so I want to do it with setTimeout.</p>
  
  <p>At the moment I have only code to choose random hobby from random person.</p>
  
  <pre><code>setTimeout(() =&gt; {
        const randInst = Math.floor(Math.random() * this.state.people.length);
        const hobbyIndex = Math.floor(Math.random() * this.state.people[randInst].hobbies.length);
  
      }, 500);
  </code></pre>