為什麼選擇React進行前端介面的開發呢？剛開始只是聽說了這樣一個框架，看了下入門教程，覺得用起來應該很爽，因為不需要通過jquery操作dom了。。最近在做專案過程中，又讀了一些react相關的文件，加上自己的一些體會，這裡對下React的特點以及值得選擇的原因做一下總結~

React是什麼

React是一個用於構建使用者介面的JavaScript庫,它通常被看作MVC中的View端，但又不僅僅是View那麼簡單

React為開發人員帶來的體驗提升

剛開始，在我對很多前端新的主流知識都不瞭解的情況下，偶然知道了React，並且排除萬難(主要是學習相關技術棧。。)都想把React用起來的最大原因是，React對我這種開發人員的體驗簡直太好(雖然很多是聽說:))，應用React的開發模式對還停留在以前的jquery模式的我來說是那麼那麼的驚喜？那麼對比以前的開發模式到底有什麼不同？

不再直接操作DOM

js中操作DOM本身就有較高的代價，而react讓我們不用直接操作DOM，而是操作由物件組成的Virtual DOM，在jquery時代，我們需要自己查詢dom元素，再精確地計算出哪些DOM元素要改變，再對其呼叫方法重新渲染，這之中耗費了極大的精力，而Virtual DOM讓我們不再關注直接對DOM的控制操作，避免了對原生DOM的汙染，而是轉向運算元據，由資料對映為UI的表現(由Virtual DOM組合而成)，當然VirtualDOM不止有這一個優點，還有其他優點(如同構)。總之Virtual DOM的引入使我們保持了效能上的高效和穩定的同時，降低了直接操作DOM而錯誤導致的風險。

宣告式程式設計

宣告式程式設計，即宣告式程式設計，與之相對的是指令式程式設計，自己以前在前端的程式設計還停留在指令式程式設計，比如jquery,實現某個功能的時候，通常是拿到某個元素，再對這個元素做某個操作，而react的精髓之一可以說是函數語言程式設計了，通過直接將資料狀態對映為元件的展示，UI與資料之間的關係是，UI=f(data),data由元件自身的state和接收的props組成，data的變化會對映為UI得的變化，所以在做一個UI需求的時候，最開始我們只需要思考不同的資料狀態會渲染什麼樣的UI就可以了，而之後只要改變data(通過改變state或接收props)就會自動完成UI的重新渲染。

元件化

在React中，一切都是元件，通過構建可複用元件來構建使用者介面是React的核心思想之一,React推薦以元件的方式重新思考UI的構成，React元件即為元件元素，在React中，元件元素被描述為純粹的JSON物件，這就意味著可以使用方法或類來構建元件，表達元件元素的JSON物件格式如下：

{
  type: Table,
  props: {
  size: 'large',
  children: 'List'
}
複製程式碼

其中children是很關鍵的一個屬性，children代表子元件或子元素，也具有同樣的JSON結構表示，這樣我們可以自由的對元件元素進行層層巢狀或組合 ##自上而下的狀態流， 可預測，易定位 元件擁有自己的內部狀態state,並且可以由父元件傳遞props資料，最終將props和內部的state資料對映到元件的表現形式，react本身的狀態流就是自上而下的，即上級可以通過props傳遞資料到子級元件，反之則不可能，這使得元件的表現形式更加可預測，當表現與預期不符時，也方便我們找到對應程式碼的位置，定位問題。

跨平臺，易於服務端渲染

react號稱"Learn once,write anywhere",即只要學習一次，就可以寫出在任何地方執行的程式碼，PC端，Android，IOS，都可以用react語法來編寫，這同樣得益於react的Virtual DOM機制，在react中，我們的操作物件是Virtual DOM,與真實環境無關，無論是PC端，安卓，還是IOS，只要有從Virtual DOM到最終實體的轉換工具即可，在瀏覽器端，Virtual Dom轉換為真實DOM的轉換工具由react-dom實現，對映為移動APP實際UI元素的工具則由react-native實現，同樣的，服務端渲染，則是把Virtaul-DOM對映為字串，由react-dom/server的renderToString方法來進行渲染。