React如此受歡迎離不開這4個主要原則

在看似無窮無盡的JavaScript前端框架和庫中，有一個庫（可以説）佔據了至高無上的地位，那個庫就是React。但是為什麼React年復一年地如此受歡迎呢？在我們深入研究使它如此受歡迎的React原理之前，首先需要了解是什麼導致了React的起源以及它旨在解決什麼問題。

React的起源

從90年代到21世紀初，前端Web開發與現在不同。它的用户界面少得多，也不像今天的網站那樣具有交互性。在jQuery出現之前，沒有統一的方式來工作和操作DOM（文檔對象模型），jQuery是第一個為開發人員創建統一的方式來使用DOM而不必擔心開發人員當時面臨的跨瀏覽器兼容性問題的API。這很棒，隨着網站變得越來越大，backbone.js等其他框架允許操作DOM變得越來越容易。

單頁應用程序（SPA）的誕生

隨着前端開發變得越來越容易。網絡開發開始發生轉變，每次我們想顯示不同的內容時，我們不需要總是從服務器獲取應用程序代碼，取而代之的是，現在更多的應用程序正在操縱JavaScript來顯示新內容，而無需與服務器通信。這意味着我們將更少地依賴超文本標記語言，而更多地依賴JavaScript。隨着受歡迎程度的提高，谷歌開發了一個名為AngularJS的框架，以進一步提高開發SPA的效率。

Facebook問題

儘管當時人們注意到隨着應用程序的擴展和前端變得越來越複雜，開發人員很難調試他們的代碼並弄清楚數據是如何流動的。對於臉譜網及其臉譜網廣告應用程序來説尤其如此。儘管他們沒有使用AnGuardiJS，臉譜網廣告團隊意識到，隨着越來越多的人加入開發團隊，他們的代碼庫也在增加，工程師和開發人員跟不上，他們意識到他們需要一個最適合他們應用程序的更好的架構。

React解決方案

為了解決臉譜網面臨的問題，2013年臉譜網發佈了一個非常適合他們的庫，叫做React。一年後，谷歌意識到AngularJS的架構使得開發人員很難大規模地創建好的應用程序，所以他們正在創建一個名為Angular的重拍。隨着React的出現，許多人轉向使用React創建應用程序，反過來，自從大型科技公司開始使用React以來，React的受歡迎程度飆升。

React的4個原則

隨着React的出現，有4個關鍵原則導致了它的持續成功。這4個是

1. 聲明式與命令式方法

在 React 之前，當開發人員與 DOM 交互時，他們要麼使用庫，要麼手動更改 DOM 的各個部分以響應各種用户事件。這種思維方式被認為是必要的。例如：

在上面的示例中，我們循環遍歷listOfNumbersand 在每次迭代期間，我們將當前數字添加到newList乘以 10 的末尾。解釋每個步驟以實現結果的過程是命令式思維方式的簡單示例。另一方面，以下是聲明式編程的示例：

在上面的示例中，這是聲明性的，因為我們沒有展示如何製作列表的每個步驟，而是通過使用map()為我們完成工作的函數來抽象出一些功能。這很棒，因為它允許我們在擴展時更輕鬆地調試代碼。

當涉及到 React 時，當我們操作 DOM 而不是以命令式的方式進行操作時，我們使用 JavaScript 來顯示響應事件的每個步驟。現在，我們可以改為向 React 顯示我們應用的狀態，並且 React 會以它知道的最佳方式呈現應用。這就是“React”這個名字的由來，因為它會在狀態變化時做出反應！

2. 組件架構

第二個原則是 React 的架構基於可重用組件。這會將我們的 Web 應用程序分解為樂高積木，我們可以將它們拆開或切換到其他樂高積木。例如：

當你使用 React 創建一個網站時，它的第二個原則是你想讓你的組件儘可能地可重用，這樣如果你要製作一個導航欄。導航欄本身將是它自己的組件，可以潛在地用於其他項目以及與其他人共享。與頁腳甚至按鈕組件類似。

3.單向數據流

第三個原則指出數據從父組件單向傳輸到子組件。以下是它可能採取的步驟示例：

1. 父組件將 state 的數據以 props 的形式傳遞給子組件，如果它們有的話。
2. 子組件返回當前狀態的用户界面表示或繼續將數據傳遞給降序的子組件。
3. React 呈現整個狀態的 UI。
4. 如果用户引發事件。狀態將更新，導致事件再次觸發並 React 重新渲染。
   

這很好的原因是它允許代碼隨着應用程序的擴展而更易於維護。當我們在組件中出現錯誤時，我們知道我們可以查看組件的位置，然後在那裏糾正該錯誤，而不必懷疑它是否是由於組件範圍之外的數據造成的。

4. 用户界面庫

最後一個原則是，React 歸根結底是一個 UI 庫，它只是用户與前端應用程序交互的一種方式。它在如何構建應用程序方面沒有像框架那樣嚴格的結構。思考 React 的一個好方法是，與框架相比，它就像一個烤箱，而框架就像一個為您提供所有工具的廚房。React 允許廚師和開發人員選擇他們自己的工具來製作他們的應用程序。React 可用於網絡、移動設備，甚至用於開發虛擬現實。

結語

在眾多前端框架和庫的海洋中，React 受歡迎是有原因的。它不僅提供了堅實的編程範式，而且使代碼更易於維護。隨着技術的發展和前端格局的變化，看看 React 的壽命能走多遠將會很有趣。

原文鏈接： ​ ​The 4 Main Principles of React That Made It So Popular​ ​