如有疏漏錯誤，還望指正。轉載不忘加上>>原連結<<哦~

react-native是什麼？ react-native原理

從字面意思上來看，react-native由單詞react和單詞native組合而成，中間一個連字元連線。

我們對其中的native的概念是很清晰的，它指的就是原生app，也就是用原生開發方式開發出來的應用。

那麼react又是什麼呢？他們之間的連字元又有什麼特殊的意義呢？下面我們來一一解答。

首先我們來說說react。react是什麼？

官網上定義React是一個用於構建使用者介面的js庫。 React是宣告式的，高效率的，併兼具靈活性

我們來理解一下，用於構建使用者介面的js庫有很多啊，比如說angular，vue，jquery，ext等等，都可以被稱為使用者構建使用者介面的js庫。

那麼react和它們比又有什麼不同呢？定義裡說react是宣告式的，高效率的，併兼具靈活性，這就是react的不同之處了，也可以稱為react的幾個特性吧。

接下來我們就來分別介紹一下react的這幾個特性。

1.宣告式：宣告式是由JSX語法來表現的

我們來對比一下，首先是原生的js語法：

React.createElement(MyButton,{
    color:'blue',
    shadowSize:2
},'Click Me');

再來看一下jsx語法：

<MyButton color="blue" shadowSize={2}>Click Me</MyButton>

大家一看，這不就是一個語義化的標籤麼，這樣寫的確比上面寫起來簡單，看起來也更清晰，但這就是JSX了麼？當然不是，JSX語法的重點在於它是與js程式碼混寫的，配合es6就像下面這樣：

class ShoppingList extends React.Component {
  render() {
    return (
      <div className="shopping-list">
        <h1>Shopping List for {this.props.name}</h1>
        <ul>
          <li>Instagram</li>
          <li>WhatsApp</li>
          <li>Oculus</li>
        </ul>
      </div>
    );
  }
}

現在是不是感覺有點cool了？JSX語法使用語義化的標籤來簡化程式碼的編寫，提升了程式碼可維護性的同時也降低了學習成本。

現在主流的IDE和文字編輯器都可以通過安裝外掛來支援JSX語法。

所以這個宣告式指的是什麼呢？指的就是上面程式碼中用大括號括起來的部分{this.props.name}這裡類似於angular中的資料繫結。聲明瞭UI中的表現與js中資料的關係。

2.高效率：高效率是由虛擬DOM來實現的。

虛擬DOM技術指的是使用javascript Object模擬DOM樹，計算變更，減少重繪，提升效率的一種技術實現。

這裡有一篇文章，寫的非常不錯，我就直接給大家引用過來，大家自己看吧。
>>虛擬DOM技術分析<<

3.靈活性：這個靈活性範圍就廣了，有安裝的靈活性，編寫程式碼的靈活性等。我側重來說一個，就是components，元件化。

react-native通過Components進行元件化。它把UI分割成獨立的、可重用的部件 。元件化這個概念大家也都不是第一次聽說了吧，如果比較陌生的同學，可以自己搜搜哈。

react有它自己的元件化方式，就是所有模組都繼承自React.Components，這比angular的modules更輕量級，結構也更簡單，條條框框也減少了很多，是所謂真正的感受到了靈活性呢。

程式碼示例就像上面講JSX語法的時候引用的那段，大家體會一下。

好的，我們瞭解完了react的三個特性，也對react有了初步的理解。那麼回到我們最開始的問題：react-native是什麼啊？

字面上來說，我們已經瞭解了react，瞭解了native的含義，那麼react和native又是如何聯絡起來的呢？

首先，React通過虛擬DOM實現了對UI層的解耦（無論是android還是ios）。

然後，將瀏覽器的DOM樹替換為Native的UI模組，使React在移動端進行渲染。

最後，採用Native的核心API完成react與native的通訊。

由於採用native原生UI作為展現層，所以react-native具有可以媲美原生應用的優秀使用者體驗與效能優勢。

我們對react-native的一些字面上的概念都有了一定的瞭解。我把以上內容簡單的概括為：react-native是基於react技術編寫native應用的一門技術，它繼承了react簡明、高效、靈活的特點，又兼具native優秀的使用者體驗。

react-native技術採用js編碼，編寫的應用具有跨平臺、可熱更新的優勢。這就是我眼中的react-native。