上一篇文章介紹了React的目的，就是開發(fā)數(shù)據(jù)不斷變化的大型應(yīng)用程序携茂，而這其中的關(guān)鍵就是虛擬DOM讳苦，而JSX就是一種利用HTML語法來構(gòu)建虛擬DOM的語言鸳谜。
使用JSX定義直觀的用戶界面
JSX是將HTML直接嵌入到JavaScript中的一種XML語法咐扭，拋開了傳統(tǒng)的將業(yè)務(wù)和邏輯相分離的“最佳實踐”蝗肪。
它的語法很像HTML穗慕，但并不是HTML逛绵。之后JSX通過翻譯器轉(zhuǎn)換到純JavaScript再由瀏覽器執(zhí)行。
可以將JSX理解為一個比較高級但很直觀的語法糖胰苏。
它使用了js自帶的語法和特性硕并，而不需要使用模板引擎埃仪，使開發(fā)人員只需要利用代碼去構(gòu)建整個界面卵蛉。
JSX中的大花括號中是JavaScript語法傻丝。
在JSX中使用樣式，屬性值不能為字符串而必須為對象允睹。所以JSX中的樣式都用兩個大花括號括起來胁澳，第一個大花括號是標(biāo)準(zhǔn)JSX語法，代表這其中是JavaScript語法胰丁，第二個大花括號代表這是JavaScript的對象表達式锦庸。
所謂組件，其實就是狀態(tài)機器
React將界面看做簡單的狀態(tài)機器扬卷。當(dāng)組件處于某個狀態(tài)時，那么就輸出這個狀態(tài)對應(yīng)的用戶界面
React的組件與外界交互的除了狀態(tài)（state）外徒恋，還有就是屬性（props）基括。屬性一般被認(rèn)為是只讀的，在組件初始化的時候傳入匠璧，是不可修改的。而狀態(tài)是用來更新組件UI的酿雪，一般由組件內(nèi)部去維護。
組件很少需要對外公開方法醋安，唯一的交互途徑就是props。
每個子節(jié)點都是通過父節(jié)點的render方法去構(gòu)造的柠辞。
每個組件都會有一個render方法，這個方法返回組件的實例。最終整個界面得到一棵虛擬DOM樹间螟。
每一次界面變化都是整體刷新
React通過框架自身解決了局部UI需要更新的問題荣瑟。實現(xiàn)途徑就是通過虛擬DOM。
而局部UI更新最重要的就是React的Diff算法嚷掠。
Diff算法基于兩種假設(shè)：
- 不同類型的組件產(chǎn)生不同的DOM結(jié)構(gòu)熊楼。
- 對于同一層次的一組子節(jié)點鲫骗，它們可以通過唯一的id進行區(qū)分枕磁。
單向數(shù)據(jù)流動Flux
Flux定義了一種單向數(shù)據(jù)流的方式，來實現(xiàn)View和Model之間的數(shù)據(jù)流動峭咒。
Flux是一種單向數(shù)據(jù)流和單向數(shù)據(jù)綁定的思想，用來定義組件之間、組件和數(shù)據(jù)模型之間如何通信。
Redux霍狰、Reflux康震、Flummox都屬于Flux的第三方實現(xiàn)。
雙向數(shù)據(jù)綁定是指Model可以引起View的變化。View也可以接受用戶輸入引起Model的變化。
Flux中的Store是存儲應(yīng)用程序的狀態(tài)郎嫁。
對于一個小組件泽铛，狀態(tài)可以在內(nèi)部進行維護。
而對于多個組件構(gòu)成的應(yīng)用程序瓢喉，某些需要組件之間共享的狀態(tài)要放到Store中進行維護栓票。
每當(dāng)Store發(fā)生變化時，View也會進行相應(yīng)更新愕够。
Flux引入了Dispatcher和Action的概念走贪，Dispatcher是一個全局的分發(fā)器負責(zé)接收Action，而Action可以來自于用戶的某個界面操作惑芭，也可以來自于服務(wù)器端的某個數(shù)據(jù)更新坠狡。
只讀數(shù)據(jù)模型：Immutability
React提倡利用只讀數(shù)據(jù)來建立數(shù)據(jù)模型。所有數(shù)據(jù)都是只讀的遂跟，如果需要修改某個數(shù)據(jù)逃沿，只能產(chǎn)生一份新的數(shù)據(jù)婴渡。
