有兩種可行的方法來創建一個組件： 1. ** Function Components:** 這是創建組件最簡單的方式。這些是純 JavaScript 函數，接受 props 對象作為第一個參數并返回 React 元素： ~~~js function Greeting({ message }) { return <h1>{`Hello, ${message}`}</h1> } ~~~ 2. **Class Components:**你還可以使用 ES6 類來定義組件。上面的函數組件若使用 ES6 的類可改寫為： ~~~js class Greeting extends React.Component { render() { return <h1>{`Hello, ${this.props.message}`}</h1> } } ~~~ 通過以上任意方式創建的組件，可以這樣使用： ~~~js <Greeting message="semlinker"/> ~~~ 在 React 內部對函數組件和類組件的處理方式是不一樣的，如： ~~~js // 如果 Greeting 是一個函數 const result = Greeting(props); // <p>Hello</p> // 如果 Greeting 是一個類 const instance = new Greeting(props); // Greeting {} const result = instance.render(); // <p>Hello</p> ~~~ > 如果組件需要使用**狀態或生命周期方法**，那么使用類組件，否則使用函數組件。 閱讀資源： 1. [React 如何區分 Class 和 Function?](https://overreacted.io/zh-hans/how-does-react-tell-a-class-from-a-function/)