近些年來，誕生了不少優(yōu)秀的前端開發(fā)工具（類庫）。JS的庫和框架能簡化工作流程、提供開發(fā)效率并更好地進行響應式設計。

鑒于 JavaScript 的庫實在太多了，就算你花很多時間和精力，也不一定能找到優(yōu)秀而且適用（于項目）的庫。 （之前）我們已經(jīng)討論過了 優(yōu)秀的 JavaScript 框架 ，而今天我們會根據(jù) Github 上 star 的增長數(shù)，篩選出出一些最好的 JavaScript 庫。 你很可能已經(jīng)聽說過 jQuery 或者 React 的大名了，二者都是非常有用的 JavaScript 庫。當然，還有其他很多優(yōu)秀的類庫。

其中一些庫幾乎是每個項目都會引入的，其他的一些（庫）則是專注于某些方面，當你的應用需要支持特殊的功能時就可以引入它們。為了更好地說明，我們按照類型整理出最好的 JavaScript 庫，現(xiàn)在就讓我們進入正題吧。

圖表 & 圖形

一、D3.js：https://d3js.org/

D3.js (Data-Driven Documents (譯者注：即數(shù)據(jù)驅(qū)動文檔)) 被譽為是在開源項目中最強大的數(shù)據(jù)可視化 JavaScript 庫。它擁有完善的生態(tài)，基于 D3.js ，你能使用海量的插件與庫。同時，社區(qū)的支持與大量的參考資料能使你輕易入門 D3.js 。

D3.js遵從 W3C 標準，幾乎支持所有的現(xiàn)代瀏覽器。盡管它沒有預建任何圖表，無法開箱即用，但它提供了非常多的例子與非常有用的特性，如：enter 與 exit 的選擇，能讓你非常容易定位 bug 與繪制圖表。

二、Chart.js：http://www.chartjs.org/

Chart.js 是一個為小型項目提供繪制圖表功能的開源類庫。如果你需要簡單快速地繪制一個圖表，那個 Chart.js 可以幫到你。它擁有8種圖表類型，也可以組合使用，并提供強大的動畫功能。若你希望快速開展項目，我們推薦這個類庫，盡管它的功能并不多。Chartist.js 的特性都是類似的功能，它是基于 SVG 構建的，而 Chart.js 是基于 canvas。

三、FusionCharts：http://www.fusioncharts.com/

FusionCharts 被認為是目前最好的 Javascript 制圖庫。它是最全面的繪制圖表解決方案，包含超過90種表格與1000種圖，遠勝于Google Charts 和 MetricsGraphics。

如今，F(xiàn)usionCharts 可以自豪地說，它的使用者超過24,000，不乏來自白宮、Oracle, IBM, Microsoft, Google 及其他大公司的客戶。作為最流行的 JavaScript 庫之一，F(xiàn)usionCharts 的擴展性良好，支持各種瀏覽器與設備，包括 IE6,7,8等。然而，在非商業(yè)項目與個人項目中，可以使用含有水印的版本，但若要使用不包含水印的版本，則需要購買許可。

四、Google Charts：https://developers.google.com/chart/

Google Charts 允許你構造任何東西，從普通線圖到復雜的樹狀圖都毫無問題。它配備了大量的預制圖表、各種數(shù)據(jù)展示方式與多種自定義選項。（Google Charts）基于 HTML5 與 SVG 繪制圖表，因而可以確保不同瀏覽器與平臺之間的兼容性，為了兼顧老舊的 IE 版本，它還包含了 VML。

Google Charts 擁有詳盡的文檔與代碼注釋，并提供了漸進式的指導工具，能使任何想要使用 JavaScript 繪制圖表的開發(fā)者都可以很好地入門 Google Charts 。然而，由于文件都是由 Google 的服務器發(fā)送給你的應用，你必須在線才能看到繪制的圖表。

動畫

五、GSAP：https://greensock.com/gsap

GSAP （GreenSock Animation Platform）是一個為大型企業(yè)便利地生成出色動畫的優(yōu)秀框架。超過兩百萬的網(wǎng)站使用（GSAP），其中包括福特、耐克、 Adobe 、微軟、三星等大企業(yè)。

GSAP 在不同平臺（譯者注：PC端與移動端）和不同瀏覽器之間都有著良好的兼容性。它的特性基于 SVG 構建，能高效地完成 DOM 元素的拖動、旋轉(zhuǎn)、翻頁等。GSAP 也支持旋轉(zhuǎn)、3D轉(zhuǎn)換、按需加載等功能。

六、Bounce.js：http://bouncejs.com/

Bounce.js 是一個基于 CSS3 構建的精巧 JavaScript 動畫庫，（通過使用它）你能輕易地讓創(chuàng)造出令人印象深刻的動畫。它預設了10款動畫，如rotate, swoosh, jelly, road runner（譯者注：我沒用過這個東東、不好翻譯、有使用經(jīng)驗的同學麻煩告訴我一下應該如何翻譯）等，（通過使用它們）可以創(chuàng)造出流暢的動畫，你可以在任何項目中使用 Bounce.js 。

這個庫是 MIT 許可而且完全免費，當你不需要太多動畫類型、進行實驗項目或只是想嘗試一下使用動畫的時候，它是一個非常好的選擇。

七、Animate.css：https://daneden.github.io/animate.css/

Animate.css 是一個允許你對特定對象添加精巧動畫的 CSS 庫。它使用 CSS3 預設了超過50種動畫，可添加到文本、表單、對象和圖片中。由于 Animate.css 體積很小且跨瀏覽器支持，使得它在移動端項目、滑動條、首頁等應用場景中大放異彩。

時間 & 日期

八、Moment.js：https://momentjs.com/

Moment.js 是一個輕量級的日期庫，使得解析、操作、格式化日期和時間變得精確且簡單。它提供了多語言支持、持續(xù)時間（統(tǒng)計）、日歷表等，同時通過各種插件可以支持時區(qū)（切換）、整合 Twitter 等功能。但最重要的還是它可以讓你避免直接操作原生的 JavaScript Date 對象（譯者注：Date對象還真是挺反人類的，曾在國際項目中吃過大虧），其次是可以省略復雜的（時間）解析過程且減少（你分析時間的）代碼量。

九、Date-fns：https://github.com/date-fns/date-fns

Date-fns 是一個能在瀏覽器和 Node.js 中操作時間和日期的先進工具。Date-fns 擁有超過140種的特性，得益于 API 的簡潔設計，它們使用起來十分簡單。由于 Date-fns 是模塊化構建的，你在項目中可以只使用你需要的那一部分功能（而不必加載全部）。

其他

十、Math.js：http://mathjs.org/

Math.js 是一個為瀏覽器、Node.js及其他 JavaScript 引擎提供數(shù)學運算的開源庫。它配備了許多（運算）功能與常量，能靈活地解析表達式，也提供了大數(shù)，單元，字符串，分數(shù)，矩陣，數(shù)組和符號的計算支持。

十一、Handsontable：https://handsontable.com/

Handsontable 是一個可輕松地為 Web 應用提供表格的 JavaScript 表格庫。它通過不同的插件能實現(xiàn)不同的延伸。Handsontable 基于模塊化構造，入門簡單且社區(qū)活躍。這個表格庫在免費版本中包含了超過30特性，專業(yè)版本則額外增加十多種功能。目前， Handsontable 常用于銷售報告，人力資源規(guī)劃，數(shù)據(jù)合并，數(shù)據(jù)庫編輯等領域。

小結

JavaScript 庫對于程序員或設計師而言，都是十分有用的工具。它們能為你的 Web 應用和網(wǎng)站添加很多強大的功能或提供更好的外觀，這些都能提高用戶體驗。由于新的 JavaScript 庫不斷誕生，未來這篇文章會加入更多的推薦。