March 2017
Intermediate to advanced
248 pages
3h 10m
Japanese
ここまでのコードでは、render()関数の中で定義されるユーザーインタフェースはReact.createElement()やReact.DOM.*のメソッド群(React.DOM.span()など)を使って定義されていました。メソッド呼び出しの構造が複雑になり、閉じカッコを正しく記述するのが面倒という問題がありました。そこで、よりシンプルな記法としてJSXが用意されています。
JSXはReactとは独立したしくみのため、使わなくてもまったく問題ありません。実際に、3章までのコードではJSXを使っていません。JSXを一切使わないということも可能です。ただし、一度便利さを知るとメソッド呼び出しの世界には戻りにくくなるでしょう。
![]() |
|
JSXが何の略かは定かではありませんが、JavaScriptXMLまたはJavaScript Syntax eXtensionの略だとされることがよくあります。JSXはオープンソースプロジェクトで、ホームページはhttp://facebook.github.io/jsx/にあります。 |
1章で取り上げたHello worldの例を思い出してみましょう。
<script src="react/build/react.js"></script> <script src="react/build/react-dom.js"></script> <script> ReactDOM.render( React.DOM.h1( {id: ...Read now
Unlock full access