title: reset array in react does not go to original state
body: <p>After insert elements into the array, when I reset, it does not go to the initialStateOfList that is to [1,2,3,4,5]. </p>
  
  <p>For example, If I insert 6 and 7, then press on clear and then reset button, it goes to [1,2,3,4,5,6,7] and not [1,2,3,4,5].</p>
  
  <p>What should I do to make it go back to the original state?</p>
  
  <pre><code>import React , {Component} from 'react';
  import {render} from 'react-dom';
  
  const initialStateOfList = [1,2,3,4,5];
  
  class Form extends Component{
  
     state = {
      tempo : '',
      list : initialStateOfList
    };
  
    clearArray=()=&gt;{
      this.setState({list:[]});
    }
  
    resetArray=()=&gt;{
      this.setState({list:initialStateOfList});
    }
  
    tempAdd=(event)=&gt;{
      this.setState({tempo:event.target.value});
    }
  
    addItem=(event)=&gt;{
      event.preventDefault();
      this.state.list.push(this.state.tempo);
      this.setState({tempo:''});
  
    }
  
    render(){
  
      const listitem = this.state.list.map((number) =&gt;  &lt;li&gt;{number}&lt;/li&gt;);
  
  
      return(
        &lt;div&gt;
          &lt;form ref="form" id="getInput" onSubmit={this.addItem}&gt;
            {this.state.list.map((listItem)=&gt;&lt;li&gt;{listItem}&lt;/li&gt;)}
            &lt;input type="text" ref="formText" id="adder" onBlur={this.tempAdd} /&gt;
            &lt;input type="submit" ref="formSubmit" id="passer" /&gt;
            &lt;button id="clear" onClick={this.clearArray}&gt;clear&lt;/button&gt;
            &lt;button id="reset" onClick={this.resetArray}&gt;reset&lt;/button&gt;
  
          &lt;/form&gt;
        &lt;/div&gt;
      );
    };
  }
  
  export default Form;
  </code></pre>