JavaScript 的普及造就了一個非常活躍的技術，框架和庫的生態系統。 這個生態系統不斷涌現多式多樣的框架和技術，對許多人來說都是高度的混亂。 那么你應該關注什么樣的技術呢？
你應該在哪里方面投入時間來獲得最大收益呢？ 目前公司招聘哪些技術棧呢？ 哪些技術增長潛力最大呢？
現在最重要的技術是什么？這篇文章高度概括了你需要知道的內容，你可以通過文章中的鏈接了解所有關于它的一些信息。
記住，當你在學習一些實際的代碼時，您可以在 Codepen.io 上交互式地執行代碼。如果你還在學習 ES6 ，您可以看看如何使用 Babel REPL 進行轉譯。
這個列表很長，但不要氣餒。你可以做到！ 在看這個清單列表時，如果你擔心你將如何學習所有構建現代應用程序所需知識，那么建議你先閱讀一下 “為什么我要感謝 JavaScript 疲勞” 。然后靜下心來，開始學習和工作。
有些東西嚴格的說是 可選的* ，這意味著，如果您對他們感興趣，我推薦它們，或者你的工作需要了解它們，但你不應該覺得必須去學習它們。任何標有星號的東西(例如:example*)都是可選的。
任何沒有帶 * 的東西都應該學習，但是不要覺得要學習一切或知道一切。應該有一個很好的認知，不一定需要成為一名各個領域都出眾的專家。
在嘗試以 Javscript 為生，進行工作之前，您應該對 Javascript 的基礎知識有深刻的了解：
.then() 方法附加回調，這個回調將在 promise resolves時運行。resolved 值被傳遞到你的回調函數中，例如：doSomething().then(value => console.log(value));JavaScript 代碼:
- const doSomething = (err) => new Promise((resolve, reject) => {
- if (err) return reject(err);
- setTimeout(() => {
- resolve(42);
- }, 1000);
- });
- const log = value => console.log(value);
- // 使用返回的 promises
- doSomething().then(
- // 當 resolve 時:
- log, // logs 42
- // 當 reject 時(resolve 時不會調用)
- log
- );
- // 記得處理錯誤哦!
- doSomething(new Error('oops'))
- .then(log) // not called this time
- .catch(log); // logs 'Error: oops'
Progressive Web Applications (PWAs) ： 查看 “Native Apps are Doomed” & “Why Native Apps Really Are Doomed”
Node & Express： Node 允許你在服務端運行 JavaScript ，這意味著您的用戶可以將數據存儲在云中并隨時隨地訪問。而 Express 是 Node 社區最為流行的 Web 框架。
Lodash ：一個很好用的、模塊化的 JavaScript 實用工具函數庫，包含功能編程的好東西，你可以通過 lodash/fp 導入 data-last 功能模塊。
React 是個專注于構建用戶界面的 JavaScript 庫，由 Facebook 創建。它基于單向數據流的設計思想，也就意味著對于每個更新周期：
這種單向數據流與雙向數據綁定形成對比，其中對 DOM 的改變可以直接更新數據（例如，如在 Angular 1和 Knockout 的情況下）。 使用雙向綁定，在 DOM 渲染過程（稱為 Angular 1 中的摘要循環）中對 DOM的 更改可能會在繪制完成之前重新觸發繪圖階段，從而導致回流和重繪 – 從而降低性能。
React 沒有規定數據管理系統，但推薦使用基于 Flux 的方法。 React 的單向數據流方法借鑒了函數式編程和不可變數據結構的思想，改變了我們對前端框架架構的思考方式。
有關React＆Flux架構的更多信息，請閱讀 “The Best Way to Learn to Code is to Code: Learn App Architecture by Building Apps”。
Redux 為應用程序提供事務性，確定性的狀態管理支持。在 Redux 中，我們遍歷操作對象流，以減少到當前應用程序狀態。要了解為什么這很重要，請閱讀 “10 Tips for Better Redux Architecture”。要開始使用 Redux，請查看 Redux 創建者 Dan Abramov 的優秀課程：
Redux 是強制性學習，即使你從未使用 Redux 作為實際項目。
為什么？因為它會給你很多實踐，并告訴你純函數的價值所在，并教你如何將通用函數 reducers，這是一種通用的函數，用于遍歷數據集合并從中提取一些值。Reducers通常是非常有用的，以至于Array.prototype.reduce已添加到 JS 規范。
Reducers 不僅僅對于數組是重要的，同時學習使用Reducers 的新方法本身也是有價值的。
Angular 2 是 Google 廣受歡迎的 Angular 框架的繼承者。 因為它瘋狂的人氣，掌握它會使簡歷看起來很棒 —— 但我仍舊建議優先學習 React 。
我喜歡 React 超過 Angular 2+，因為：
為此，我推薦學習 React，但我認為 Angular 2+ 嚴格可選*。 如果你對 Angular 2+ 有強烈的偏好，那么你可以隨意選擇 React 或者 Angular 2+。 首先學習 Angular 2+，并考慮 React 可選。 這兩種情況都會讓你受益，并且在你的簡歷上看起來很不錯。
無論你選擇哪一個，盡量將精力集中學習和使用你所選擇的那個，至少6個月 – 1年后，再去學習另一個。 真正掌握它們需要很多實踐。
RxJS 是 JavaScript 的響應式編程實用程序的集合。就好比流處理領域的 Lodash 。它把響應式編程帶入到了 JavaScript 領域。ECMAScript Observables 提案是第一階段草案，而 RxJS 5+ 是規范標準的實現。
雖然我個人非常喜歡 RxJS ，如果你想在工程中使用使用整個 RxJS 的話，包體積可能很大（因為其內置了很多的 Operators ）。你可以使用部分引入來解決這個問題：
JavaScript 代碼:
- import { Observable } from 'rxjs/Observable';
- // then patch import only needed operators:
- import 'rxjs/add/operator/map';
- import 'rxjs/add/observable/from';
- const foo = Observable.from([1, 2, 3]);
- foo.map(x => x * 2).subscribe(n => console.log(n));
使用部分導入可以將您的 bundle 中的 rxjs 依賴關系減小約 200k 。 對于web項目來說這個減少已經很大了。 這將使您的應用程序更快。
很多人問我，“為什么沒有列舉出他們喜歡的框架？” 因為其中一個重要標準是，“在工作中能被真正的用上”。
是的，這是一個人氣競賽，但當你在思考學習的時間投入在什么上時，了解一個框架的時機變得格外重要。
為了回答這個問題，我看了一些關鍵指標。 首先，Google趨勢。 如果您想重現此Google趨勢圖，請記住按主題而不是關鍵字進行選擇，因為其中幾個字詞會帶來大量的假陰性。 換句話說，這些是以主題為主的趨勢，而不是關鍵字搜索：
這告訴我們人們對各個項目的相對興趣度。 如果人們正在搜索它們，那么它們很可能正在搜索他們選擇的項目，或尋找幫助或文檔。 這是一個相對合理的評價指標。
另一個很好的數據來自 Indeed.com ，它聚合不同站點上對于不同職位的開發者的招聘信息。 近幾年招聘信息急劇下降，但他們仍然收集足夠多的數據，可以看出目前招聘上對于前端開發者技能需求的情況為:
要重現這些發現，搜索 框架名稱 javascript 即可。 要重現這些發現，請搜索 javascript并將該位置留空。你可以清楚地看到：
Angular 和 React: 遙遙領先 （除了jQuery，它用于所有網站 – 包括非應用程序的巨大份額 – 因為它被幾乎所有的遺留系統使用，包括流行的 CMS 系統，如 WordPress）。
你可能會看到 Angular 在這些列表中比 React 有顯著的優勢。 為什么我依然推薦優先學習 React？ 因為：
換句話說，React 贏得了社區活躍和用戶體驗度，如果過去一年半的趨勢繼續保持，React 有一個非常明顯的機會，來代替 Angular 成為主導的前端框架。
Angular 2 擁有改變這個局面的機會，所以 Angular 可以卷土重來，但到目前為止，React 正在處于優勢一面。
Vue.js * 在 GitHub 上有大量的 stars 和 下載。如果繼續下去，它將在 2017 年能做得更好，但我認為在未來的一年左右的時間里，我不認為它不會超越 React 或 Angular（兩者都快速增長）。建議學習了 React 或 Angular 后學習 Vue.js 。
MobX * 是一個很棒的數據管理庫，已成為 Redux 的流行替代品。它也在快速增長，我預計在 2017 年會更好。對于大多數應用來說，我更喜歡Redux，但在某些情況下，MobX是更好的選擇。例如，如果頁面上有成千上萬個動態 DOM 對象，MobX 可能會表現得更好。另外，如果你的應用程序工作流都很簡單，而且你不需要事務性的、確定性的狀態，那么你可能就不需要 Redux 了。MobX 無疑是一個更簡單的解決方案。建議你在學習了 Redux 之后，再學習 MobX 。
原文鏈接：https://medium.com/javascript-scene/top-javascript-frameworks-topics-to-learn-in-2017-700a397b711
