在React v15中，我們共有三種方式可以定義一個組件。大概是React的設計者們認為，多幾種方式可以讓不同需求的開發者增加來使用React的誘因，菜色不同但都可以吃好吃飽。另一方面也可以在不同情況下使用不同定義方式，各有一些好處，簡單的效率好，復雜的彈性多。
第一種是你說的ES6方式，因為它里面有超出ES6標準的語法，通常稱為ES6+的類定義方式，是使用繼承自React.Component類別的語法，這樣式又可以稱為建構式樣式(constructor pattern)。因為現在可以直接執行ES6+相關語法與API的瀏覽器，通常會需要要新版本的瀏覽器，而且還不見得會100%相容。所以我們一般都會先經由babel工具幫忙先轉成ES5語法再執行，這樣在瀏覽器各種不同版本與品牌中，可以得到最大的相容程度。不過ES6+是一種未來將會普及的語法，也是時間早晚的問題而已?，F在官方已經都換這種方式來寫文件或教程了。
第二種是ES5的語法，這是為了要能相容于只支援ES5的瀏覽器，所使用的一種方式。最早React的版本中只有這種方式，所以網上的范例有很多都是用這種語法，如果你連JSX語法也不使用的話，那么是完全可以不需要babel工具，就可以在各種支援ES5標準的瀏覽器中執行。這種樣式又可以稱之為工廠樣式(factory pattern)。下面是例子代碼:
var HelloWorld = React.createClass({ render: function() { return <h1>{this.props.text}</h1>
}
});第三種是是函數(函式)定義樣式，這只能在無狀態的功能性元件(Stateless functional components)上使用，像我們上面的HelloWorld組件就是無狀態的(stateless)，里面沒有定義state值與相關生命周期的方法。純粹是個顯示用的簡單元件，所以可以用這個語法。這個語法是在React 0.14版本才加入的，也是前不久的事情而已(2015.10)。通常這個樣式還會使用ES6中的箭頭函式語法，讓程式碼更簡潔，不過它看起來不太像是個很厲害的組件，純粹是個函數(式)而已:
const HelloWorld = (props) => ( <h1>{props.text}</h1>
)注: React的最近版本是從0.14直接大跳板號到15.0的。
注: 箭頭函式的后面使用括號(())是只有單個語句時使用的，會自動加上return在語句前。如果是多行語句要用花括號({})，而且要加上return的語句。
函數(函式)定義方式有一些限制與規則，大致如下，太細可能要查文檔:
里面不能有state(狀態)。
里面不能用生命周期的方法，例如componentDidMount全部不行。
propTypes屬性可以用，但要寫在寫在函式區塊的"外面"
有用到JSX語句還是要import(引入)React函式庫，JSX語法相當于要調用React.createElement方法，所以需要。
這個函式定義方式現在在redux中有變化應用方式出現，就是拿來再區分為容器組件(Container Components)與呈現組件(Presentational Components)，即是以函數型的組件解決方式，完全舍棄類(建構式樣式)或工廠樣式，是一種更簡潔的體現。
