title: spread syntax "...this.props" in reactjs feels odd
body: <p>Using the spread operator in react with objects like <code>props</code> within JSX seems not to output what I expect.</p>
  
  <pre><code>&lt;Text {...this.props} /&gt;
  </code></pre>
  
  <p>seems to be rendered into <code>style="foo"</code>, where it should be <code>style:"foo"</code> as <a href="https://gist.github.com/sebmarkbage/07bbe37bc42b6d4aef81" rel="nofollow noreferrer">documented here</a>. I couldn't find this documented anywhere. I'm totally new to react and I'm trying to understand the syntax and wonder if react does undocumented stuff like this internally.</p>
  
  <p>A simple test just underlined my confusion:</p>
  
  <pre><code>const x = {...{test:1}}.test;
  alert(x);
  </code></pre>
  
  <p>alerted </p>
  
  <blockquote>
    <p>1</p>
  </blockquote>
  
  <p>And this for sure doesn't compile:</p>
  
  <pre><code>&lt;Text test: 1 /&gt;
  </code></pre>