React學習（一）

前言

公司需要，所以這些天來學習一下React。

初識

1. react的官網是https://reactjs.org/
2. 開始項目

npx create-react-app my-app
cd my-app
npm start

3. 在安裝項目的時候會下載一些包，下載完成後就建完項目啦。

4. 目錄結構
   
   大致是這樣的，其中一些沒用的東西可以刪除掉。

幾個比較重要的概念

虛擬DOM

1. 什麼是DOM？

瀏覽器中的概念，用JS對象來表示 頁面上的元素，並提供了操作 DOM 對象的API；

2. 什麼是虛擬DOM？

是框架中的概念，是程序員 用JS對象來模擬 頁面上的 DOM 和 DOM嵌套；

本質不同：虛擬DOM是用js對象，來模擬DOM元素和嵌套關係
目的：實現高效更新

比較：
原始版

改進：

---

升級版利用了虛擬DOM

Diff算法

新舊兩棵DOM樹，逐層對比的過程，就是 Tree Diff； 當整顆DOM逐層對比完畢，則所有需要被按需更新的元素，必然能夠找到；

如果第一層對比失敗，就不會往下對比了，重新生成爲了是算法簡單，方便。
注意：一般都會給每個節點起一個id，標識身份，但是一般不用索引，因爲索引位置會變

如果他涉世未深，就帶他看盡世間繁華。如果他歷盡滄桑，請帶他坐旋轉木馬。