3.1 React組件介紹

React組件從形式上看很像是JavaScript函數，通過這個函數返回一個需要在頁面上展示的React元素。其實，在第2章的代碼實例中我們已經使用到了React組件，具體的代碼如下：

【代碼3-1】

上面這段代碼就是通過JavaScript函數形式實現的React組件。React組件的結構看起來十分簡潔和高效，在函數內部定義好頁面需要的元素組合，通過return語句返回函數值就可以了。

另外，在本書第1章中介紹過，React語法是基于版本ECMAScript 6實現的。因此，React組件除了通過JavaScript函數的形式，還可以通過ES6 Class（類）的形式來實現，具體代碼如下：

【代碼3-2】

上面這段代碼就是通過ES6 Class（類）形式實現的React組件。其實，【代碼3-2】與【代碼3-1】雖然實現的手段不一樣，但最終的效果是一致的。