title: concat method with useState()
body: <p>I was learning React Hooks and was trying to get how useState works with arrays. So, I have this code: </p>
  
  <pre><code>    const App = () =&gt; {
        const initialTodos = [
    {
      id: 'a',
      task: 'Learn React',
      complete: true,
    },
    {
      id: 'b',
      task: 'Learn Firebase',
      complete: true,
    },
    {
      id: 'c',
      task: 'Learn GraphQL',
      complete: false,
    },
  ];
        const [todos, setTodos] = useState(initialTodos);
        const [task, setTask] = useState('');
        const handleChangeInput = event =&gt; {
          setTask(event.target.value);
        };
        const handleSubmit = event =&gt; {
          if (task) {
            setTodos(todos.concat({ id: 'd', task, complete: false }));
          }
          setTask('');
          event.preventDefault();
        };
        ...
      };
  </code></pre>
  
  <p>The question I wanted to ask is that why do we use concat to immutably add new object into array what if mutate and use push()?</p>