Justnote

一般透過使用者的操作進一步更改介面資料是非常普遍的行為，這一章節將透過 click event 來了解 Component Function 是如何運作的

到目前為止，專案的實作已拆成許多 Component 使其功能更加單純且可以重覆使用，但都還只停留在靜態資料，沒有包含使用者操作的行為，接下來將透過 React 提供的方式加入這些行為。

在 React Componet 中，有一點反覆提到的就是其實我們就是在寫 JavaScript，所以我們當然也可以透過其他 JavaScript 語法來進行改寫，如 ES6 Arrow Function 就可以直接改寫 Compoent return function，但這並非必要，只是更進一步說明任何 JavaScript 語法都可以直接運用在 React Component 之中。

在前面關於 React 的基礎介紹中，我們反覆提到 React Component 中的 function return 的 JSX 並非瀏覽器所能讀取的 HTML，只是經過 React 封裝過看起來像是 HTML 而已，接下來我們會進一步探討 JSX 是如何運作的

延續之前的範例，我們還可以將 Component 中 container 共同的特性獨立出來做為一個可複用的 Component，這就稱為 Composition