title: is it possible to React.useState(() => {}) in React?
body: <p>is it possible to use a <code>function</code> as my React Component's state ?</p>
  
  <p>example code here:</p>
  
  <pre><code>// typescript 
  type OoopsFunction = () =&gt; void;
  
  export function App() {
      const [ooops, setOoops] = React.useState&lt;OoopsFunction&gt;(
          () =&gt; console.log('default ooops')
      );
  
      return (
          &lt;div&gt;
              &lt;div onClick={ ooops }&gt;
                  Show Ooops
              &lt;/div&gt;
  
              &lt;div onClick={() =&gt; {
                  setOoops(() =&gt; console.log('other ooops'))
              }}&gt;
                  change oops
              &lt;/div&gt;
          &lt;/div&gt;
      )
  }
  </code></pre>
  
  <p>but it doesn't works ... the <code>defaultOoops</code> will be invoked at very beginning, and when clicking <code>change oops</code>, the <code>otrher ooops</code> will be logged to console immediately not logging after clicking <code>Show Ooops</code> again.</p>
  
  <p>why ?</p>
  
  <p>is it possible for me to use a function as my component's state ? </p>
  
  <p>or else React has its special ways to process such <code>the function state</code> ? </p>