6 個值得好好學習的 JavaScript 框架

常言道，條條大路通羅馬，可是那一條適合我呢？ 由於用於構建前端頁面等現代技術的出現，JavaScript 在 Web 開發社區早已是如雷貫耳。通過在網頁上編寫幾個函數並提供執行邏輯，可以很好的支持 HTML （主要是用於頁面的 表現 或者 布局）。如果沒有 JavaScript，那頁面將沒有任何 交互特性 可言。

現在的框架和庫已經從蠻荒時代崛起了，很多老舊的技術紛紛開始將功能分離成模塊。現在不再需要在整個核心語言中支持所有特性了，開發者允許所有用戶創建庫和框架來增強核心語言的功能。這樣，語言的靈活性獲得了顯著提高。

如果在已經在使用 JavaScript （以及 JQuery） 來支持 HTML，那麼你肯定知道開發和維護一個大型應用需要付出多大的努力以及編寫多麼複雜的代碼，而 JavaScript 框架可以幫助你快速的構建互動式 Web 應用 （包含單頁面應用或者多頁面應用）。

當一個新手開發者想要學習 JavaScript 時，他常常會被各種 JavaScript 框架所吸引，也幸虧有為數眾多的社區，任何開發者都可以輕易地通過在線教程或者其他資源來學習。

但是，唉！多數的程序員都很難決定學習和使用哪一個框架。因此在本文中，我將為大家推薦 6 個值得好好學習的 JavaScript 框架。讓我們開始吧。

1、AngularJS

（註：這是我個人最喜歡的框架）

無論你是何時聽說的 JavaScript，很可能你早就聽過 AngularJS，因為這是在 JavaScript 社區中最為廣泛使用的框架了。它發佈於 2009 年，由 Google 開發 （這夠有說服力讓你使用了吧） ，它是一個開源項目，這意味著你可以閱讀、編輯和修改其源代碼以便更加符合自身的需求，並且不用向其開發者支付一分錢 （這不是很酷嗎？）。

如果說你覺得通過純粹的 JavaScript 代碼編寫一個複雜的 Web 應用比較困難的話，那麼你肯定會興奮的跳起來，因為它將顯著地減輕你的編碼負擔。它符合支持雙向數據綁定的 MVC （ 模型-視圖-控制 （ Model–view–controller ） ） 設計典範。假如你不熟悉 MVC，你只需要知道它代表著無論何時探測到某些變化，它將自動更新前端 （比如，用戶界面端） 和後端 （代碼或者伺服器端） 數據。

MVC 可以大大減少構建複雜應用程序所需的時間和精力，所以你只需要集中精力於一處即可 （DOM 編程介面會自動同步更新視圖和模型）。由於 視圖組件 與 模型組件 是分離的，你可以很容易的創建一個可復用的組件，使得用戶界面的效果非常好看。

如果因為某些原因，你已經使用了 TypeScript （一種與 JavaScript 非常相似的語言），那麼你可以很容易就上手 AngularJS，因為這兩者的語法高度相似。與 TypeScript 相似這一特點在一定程度上提升了 AngularJS 的受歡迎程度。

目前，Angular 2.0 已經發布，並且提升了移動端的性能，這也足以向一個新的開發者證明，該框架的開發活躍度夠高並且定期更新。

AngularJS 有著大量的用戶，包括 （但不限於） Udemy、Forbes、GoDaddy、Ford、NBA 和 Oscars。

對於那些想要一個高效的 MVC 框架，用來開發面面俱到、包含健壯且現代化的基礎架構的單頁應用的用戶來說，我極力的推薦這個框架。這是為無經驗 JavaScript 開發者設計的首選框架。

2、React

與 AngularJS 相似，React 也是一個 MVC （ 模型-視圖-控制 （ Model–view–controller ） ） 類型的框架，但不同的是，它完全針對於 視圖組件 （因為它是為 UI 特別定製的） ，並且可與任何架構進行無縫銜接。這意味著你可以馬上將它運用到你的網站中去。

它從核心功能中抽象出 DOM 編程介面 （並且因此使用了虛擬 DOM），所以你可以快速渲染 UI，這使得你能夠通過 node.js 將它作為一個客戶端框架來使用。它是由 Facebook 開發的開源項目，還有其它的開發者為它貢獻了代碼。

假如說你見到過並喜歡 Facebook 和 Instagram 的界面，那麼你將會愛上 React。通過 React，你可以給你的應用的每個狀態設計一個簡單的視圖，當數據改變的時候，視圖也自動隨之改變。只要你想的話，可以創建各種的複雜 UI，也可以在任何應用中復用它。在伺服器端，React 同樣支持通過 node.js 來進行渲染。對於其他的介面，React 也一樣表現得足夠靈活。

除 Facebook 和 Instagram 外，還有好多公司也在使用 React，包括 Whatsapp、BBC、PayPal、Netflix 和 Dropbox 等。

如果你只需要一個前端開發框架來構建一個非常複雜且界面極好的強大視圖層，那我極力向你推薦這個框架，但你需要有足夠的經驗來處理各種類型的 JavaScript 代碼，而且你再也不需要其他的組件了 （因為你可以自己集成它們）。

3、Ember

這個 JavaScript 框架在 2011 年正式發布，是由 Yehuda Katz 開發的開源項目。它有一個龐大且活躍的在線社區，所以在有任何問題時，你都可以在社區中提問。該框架吸收融合了非常多的通用的 JavaScript 風格和經驗，以便確保開發者能最快地做到開箱即用。

它使用了 MVVM （ 模型-視圖-視圖模型 （ Model–view–viewmodel ） ） 的設計模式，這使得它與 MVC 有些不一樣，因為它由一個 連接器 （binder） 幫助視圖和數據連接器進行通信。

對於 DOM 編程介面的快速服務端渲染，它藉助了 Fastboot.js，這能夠讓那些複雜 UI 的性能得到極大提高。

它的現代化路由模式和模型引擎還支持 RESTful API，這確保你可以使用到這種最新的技術。它支持 句柄集成模板 （ Handlebars integrated template ） ，用來自動更新數據。

早在 2015 年間，它的風頭曾一度蓋過 AngularJS 和 React，被稱為最好的 JavaScript 框架，對於它在 JavaScript 社區中的可用性和吸引力，這樣的說服力該是足夠了的。

對於不追求高靈活性和大型架構的用戶，並且僅僅只是為了趕赴工期、完成任務的話，我個人非常推薦這個 JavaScript 框架。

4、Adonis

如果你曾使用過 Laravel 和 NodeJS，那麼你在使用這一個框架之時會覺得相當順手，因為它是集合了這兩個平台的優點而形成的一個框架，對於任何種類的現代應用來說，它都顯得非常專業、圓潤和精緻。

它使用了 NodeJS，所以是一個很好的後端框架，同時還附帶有一些前端特性 （與前面提到那些更多地注重前端的框架不同），所以想要進入後端開發的新手開發者會發覺這個框架相當迷人。

相比於 NoSQL，很多的開發者都比較喜歡使用 SQL 資料庫 （因為他們需要增強和數據以及其它特性的交互性），這一現象在這個框架中得到了很好的體現，這使得它更接近標準，開發者也更容易使用。

如果你混跡於各類 PHP 社區，那你一定很熟悉 服務提供者 （ Service Providers ） ，也由於 Adonis 其中包含相應的 PHP 風格，所以在使用它的時候，你會覺得似曾相識。

在它所有的特性中，最好的便是那個極為強大的路由引擎，支持使用函數來組織和管理應用的所有狀態、支持錯誤處理機制、支持通過 SQL ORM 來進行資料庫查詢、支持生成器、支持 箭頭函數 （ arrow functions ） 、支持代理等等。

如果喜歡使用無狀態 REST API 來構建伺服器端應用，我比較推薦它，你會愛上這個框架的。

5、Vue.js

這是一個開源的 JavaScript 框架，發佈於 2014 年，它有個極為簡單的 API，用來為 現代 Web 界面 （ Modern Web Interface ） 開發 互動式組件 （ Reactive components ） 。其設計著重於簡單易用。與 Ember 相似，它使用的是 MVVM （ 模型-視圖-視圖模型 （ Model–view–viewmodel ） ） 設計範例，這樣簡化了設計。

這個框架最有吸引力的一點是，你可以根據自身需求來選擇使用的模塊。比如，你需要編寫簡單的 HTML 代碼，抓取 JSON，然後創建一個 Vue 實例來完成可以復用的小特效。

與之前的那些 JavaScript 框架相似，它使用雙路數據綁定來更新模型和視圖，同時也使用連接器來完成視圖和數據連接器的通信。這是一個還未完全成熟的框架，因為它全部的關注點都在視圖層，所以你需要自己處理其它組件。

如果你熟悉 AngularJS，那你會感覺很順手，因為它大量嵌入了 AngularJS 的架構，如果你懂得 JavaScript 的基礎用法，那你的許多項目都可以輕易地遷移到該框架之下。

假如你只想把任務完成，或者想提升你自身的 JavaScript 編程經驗，又或者你需要學習不同的 JavAScript 框架的本質，我極力推薦這個。

6、Backbone.js

這個框架可以很容易的集成到任何第三方的模板引擎中，默認使用的是 Underscore 模板引擎，而且該框架僅有一個依賴項 （JQuery），因此它以輕量而聞名。它支持帶有 RESTful JSON 介面的 MVC （ 模型-視圖-控制 （ Model–view–controller ） ） （可以自動更新前端和後端） 設計範例。

假如你曾經使用過著名的社交新聞網路服務 reddit，那麼你肯定聽說過它在幾個單頁面應用中使用了 Backbone.js。Backbone.js 的原作者為之建立了與 CoffeScript 旗鼓相當的 Underscore 模板引擎，所以你可以放心，開發者知道該做什麼。

該框架在一個軟體包中提供了 鍵值對 （ key-value ） 模型、視圖以及幾個打包的模塊，所以你不需要額外下載其他的外部包，這樣可以節省不少時間。框架的源碼可以在 GitHub 進行查看，你可以根據需求進行深度定製。

如果你在尋找一個入門級框架來快速構建一個單頁面應用，那麼這個框架非常適合你。

總而言之

至此，我已經在本文著重說明了 6 個值得好好學習的 JavaScript 框架，希望你讀完本文後能夠決定使用哪個框架來完成自己的任務。

如果說對於選擇框架，你還是不知所措，請記住，這個世界是實踐出真知而非教條主義的。最好就是從列表中挑選一個來使用，看看最後是否滿足你的需求和興趣，如果還是不行，接著試試另一個。你也儘管放心好了，列表中的框架肯定是足夠了的。

譯者簡介：

GHLandy —— 生活中所有歡樂與苦悶都應藏在心中，有些事兒註定無人知曉，自己也無從說起。

via: http://www.discoversdk.com/blog/6-best-javascript-frameworks-to-learn-in-2016

作者：Danyal Zia 譯者：GHLandy 校對：wxy

本文由 LCTT 原創編譯，Linux中國 榮譽推出

本文轉載來自 Linux 中國: https://github.com/Linux-CN/archive