前言

學(xué)習(xí)背景：平臺測試用途需要用ReactNative開發(fā)app，來測試app操作流程中對后臺接口的調(diào)用，方便、快捷。可以作為后臺接口的可視化測試工具，驗證接口很方便，且由于可以像正常app一樣裝在手機上，臨時出問題驗證一下接口是否正常也非?？旖?。
作為一個前端開發(fā)者，初接觸React Native還未了解時 存在幾個疑問：
1. 前端很火的開發(fā)框架有AngularJS、Vue.js、ReactJS，React、ReactJS、ReactNative 有什么關(guān)系？
2. RN需要使用什么語言開發(fā)，此框架的特點是什么？
3. 與原生開發(fā)相比優(yōu)缺點是什么，為什么要使用RN框架開發(fā)移動端app？
4. RN已經(jīng)被若干大廠拋棄了，現(xiàn)在還有學(xué)習(xí)他的必要嗎？
（還有一些譬如React Native底層如何與Android和IOS通信的？React Native為何要引入VirtualDOM ，VirtualDOM是如何提高DOM更新效率的？這樣的問題在后續(xù)學(xué)習(xí)的過程中再去記錄和總結(jié)）

React、ReactJS、React Native 有什么關(guān)系？

React是基礎(chǔ)框架，是一套基礎(chǔ)設(shè)計實現(xiàn)理念，開發(fā)者不能直接使用它來開發(fā)移動應(yīng)用或網(wǎng)頁。
在React之上發(fā)展出了ReactJS框架用來開發(fā)web應(yīng)用，發(fā)展出來React Native用來開發(fā)移動應(yīng)用（構(gòu)建跨IOS與Android平臺的應(yīng)用）。^[1][2]（由Facebook開源）React Native底層也是ReactJS框架。后來，F(xiàn)acebook推出React Native后，也沒有把React的相關(guān)概念文檔從React.js文檔中分離出來，就導(dǎo)致了學(xué)React Native要去看React.js文檔。^[1]

RN需要使用什么語言開發(fā)，此框架的特點是什么？

1. 設(shè)計模式為MVVM
React Native框架的設(shè)計模式與AngularJS和Vue.js相同，是MVVM(Model-View-ViewModel)，將頁面呈現(xiàn)View與后臺的數(shù)據(jù)模型Model進(jìn)行了分離解耦。
2. 組件化開發(fā)，使用JSX定義組件
用JSX（JavaScript eXtension）開發(fā)組件，邏輯函數(shù)部分使用JavaScript ES6。UI開發(fā)是RN的強項。
3. 底層使用Virtual DOM
ReactJS與RN 底層都有Virtual DOM與DOM之間的映射與轉(zhuǎn)換，以實現(xiàn)頁面組件高效更新^[2]。
4. 可以與原生代碼混合開發(fā)
RN代碼開發(fā)的模塊與原生代碼開發(fā)的模塊，可以雙向通信，無縫銜接^[1]。移動端開發(fā)方面，「原生開發(fā)」是指 iOS 平臺通過 Objective-C 或 Swift 語言開發(fā)并通過 Xcode 編譯打包發(fā)布 iOS App，Android 平臺通過 Java 語言開發(fā)并通過 Android Studio 編譯打包發(fā)布 Android App^[2]。

• 方式1： UI界面與業(yè)務(wù)邏輯由React Native開發(fā)，但與手機平臺緊密關(guān)聯(lián)的處理由原生代碼來執(zhí)行；
• 方式2： 將原來使用原生代碼實現(xiàn)的UI包裝成React Native的自定義組件；
• 方式3：應(yīng)用界面在React Native開發(fā)的界面與原生代碼開發(fā)的界面間切換；

5. 一套代碼跨平臺，跨平臺移植迅速
不同平臺上的代碼根據(jù)平臺會有一些小區(qū)別
6. 移動應(yīng)用開發(fā)調(diào)試高效
使用RN開發(fā)，修改了代碼后可以立刻在手機上看到效果，無需重新編譯和啟動程序
7. 熱更新
使用RN開發(fā)的app，可以在用戶基本無感知的情況下更改app內(nèi)容、功能等
8. 開發(fā)出的應(yīng)用體積小
移動應(yīng)用功能越復(fù)雜，RN安裝包比原生代碼安裝包體積越小。
9. 自動匹配各種屏幕移動設(shè)備
使用React Native開發(fā)，開發(fā)者無須為不同的屏幕分辨率準(zhǔn)備不同的圖片資源或者布局文件甚至可以不考慮屏幕大小的問題，通過靈活的布局方式，React Native可以做到在不同的手機屏幕上高效、清晰的UI呈現(xiàn)。^[1]

與原生開發(fā)相比優(yōu)缺點是什么，為什么要使用RN框架開發(fā)移動端app？

優(yōu)點：

1. 開發(fā)高效，后期維護(hù)成本也低，一套代碼可以只做小小的改動即可跨平臺；
2. 移動應(yīng)用開發(fā)調(diào)試高效
3. 用戶無感熱更新；
4. 應(yīng)用包體積小；
5. 自動匹配各種屏幕移動設(shè)備

缺點：

1. 內(nèi)存消耗
   RN開發(fā)的程序運行所需的內(nèi)存比原生代碼開發(fā)的程序所需的略多；
2. 運行速度
   RN開發(fā)的程序運行運行速度比原生代碼開發(fā)的程序所需的略慢；

RN已經(jīng)被若干大廠拋棄了，現(xiàn)在還有學(xué)習(xí)他的必要嗎？

RN被拋棄的原因不在于其自身的功能的劣勢，我個人認(rèn)為各種前端框架 尤其是大火的這三種AngularJS, Vue.js, React.js(此處我們學(xué)習(xí)的是React Native)，我們不應(yīng)該只是學(xué)習(xí)這個框架如何使用的，而是應(yīng)該從底層了解各個框架的特點、優(yōu)勢，產(chǎn)生及流行起來的契機是什么（解決了什么痛點、為什么一定要用它），各種特點底層都是如何實現(xiàn)的 等等。理想狀態(tài)是能達(dá)到融匯貫通，一法通萬法通，能夠有助于我們更好的技術(shù)選型、架構(gòu)設(shè)計、編寫高質(zhì)量的代碼。比如現(xiàn)在正在學(xué)習(xí)的ReactNative，為何React引入了VirtualDOM的概念，它有什么優(yōu)勢 如何實現(xiàn)的？RN實現(xiàn)熱更新的原理是什么？我認(rèn)為都是值得好好了解的知識點。

1. React Native與React的關(guān)系及特點 ? ? ? ?

2. 一次掌握 React 與 React Native 兩個框架 ? ? ?