title: Why set a React Component's state outside of the constructor?
body: <p>So I just downloaded source code from a React framework, and I'm getting this error in Terminal:</p>
  
  <pre><code>  ERROR in ./src/components/TextEditor.js
    Module build failed: SyntaxError: Unexpected token (24:8)
  
    22 | 
    23 |   // Set the initial state when the app is first constructed.
  &gt; 24 |   state = {
       |         ^
    25 |     state: initialState
    26 |   }
    27 | 
  </code></pre>
  
  <p>My question is, why do people set a React Component's state like this?  What's the benefit if it'll error for some people?  Also, is there a Babel preset or plugin I can get to prevent this error?</p>
  
  <p>This is how I usually set a component's state, and from what I've seen, this is conventional:</p>
  
  <pre><code>constructor() {
    super();
    this.state = {
      state: initialState
    };
  }
  </code></pre>
  
  <p>For the record, this is the entire document:</p>
  
  <pre><code>// Import React!
  import React from 'react'
  import {Editor, Raw} from 'slate'
  
  const initialState = Raw.deserialize({
    nodes: [
      {
        kind: 'block',
        type: 'paragraph',
        nodes: [
          {
            kind: 'text',
            text: 'A line of text in a paragraph.'
          }
        ]
      }
    ]
  }, { terse: true })
  
  // Define our app...
  export default class TextEditor extends React.Component {
  
    // Set the initial state when the app is first constructed.
    state = {
      state: initialState
    }
  
    // On change, update the app's React state with the new editor state.
    render() {
      return (
        &lt;Editor
          state={this.state.state}
          onChange={state =&gt; this.setState({ state })}
        /&gt;
      )
    }
  
  }
  </code></pre>