[React] 學習筆記

The Virtual DOM

React 的成功和廣泛運用有相當大的部分來自於此，免除掉JavaScript 必須更新整個 DOM 的低效，Virtual DOM 類似 DOM 的藍圖，就像輕量級副本一樣，他會比較更新前後的差異(diffing) 後，再針對有修改的部分作出更新。

當在 React 中更新DOM時，會發生以下情況：

1. 整個 虛擬DOM 得到更新。
2. 將 虛擬DOM 與更新之前的外觀進行比較。React 找出哪些對像已更改。
3. 更改的對象（僅更改的對象）在 真實 DOM 上進行更新。
4. 實際DOM上的更改會導致屏幕更改。

可以參考這一篇 React: The Virtual DOM

Component

Component 可以視作 React 中最重要的概念，Component 就像一個製造零件的工廠，可以把動態、JSX 零件直接用來更改DOM，這讓必須搭配 HTML 的開發變得更加游刃有餘。

props 與 state

A React component should use props to store information that can be changed, but can only be changed by a different component.

A React component should use state to store information that the component itself can change.