title: setState() inside different function calls
body: <p>I have to use <code>setState()</code> in different functions. The crux is, I manipulate the same state attributes ('test', 'options') with different values, depending on the current state or usecase and call other inner functions (<code>this.doSomething()</code>).
  The problem is in <code>function1()</code> where I call all functions one after another. How can I guarantee that the condition <code>'this.state.test' === '2'</code> in <code>function3()</code> is thuthy?</p>
  
  <p>I know, <code>setState()</code> in asynchronous and there is a callback function but how can I use this callback when having multiple functions like in my setting? I don't want to use any "callback hell" and would like to know if there is any elegant way to achieve this...</p>
  
  <p>Kind regards</p>
  
  <pre><code>function1() {
    ...
    this.function2();
    this.function3();
    this.function4();
    ...
  }
  
  function2() {
    this.doSomething();
    this.setState({
      options: 'abc',
      test: '2'
    });
    ...
  }
  
  function3() {
    this.doSomethingElse();
    if (this.state.test === '2') {
      this.setState({
        options: 'def'
        test: '3'
      });  
    }
    ...
  }
  
  function4() {
    this.doAnything();
    this.setState({
      options: 'xyz',
      test: '4'
    });
    ...
  }
  </code></pre>