JavaScript的流行促進了一個非?;钴S的由相關(guān)技術(shù),框架和庫組成的生態(tài)圈的發(fā)展,。整個生態(tài)圈的多樣性和活躍性越來越強,,這讓許多人變得越來越困惑。 你應(yīng)該了解些什么技術(shù)呢? 我們應(yīng)該將時間花費在哪里才能獲得最大的收益,? 現(xiàn)在公司招聘要求的技術(shù)棧包括哪些,?哪項技術(shù)的發(fā)展?jié)摿ψ畲螅?/p> 當(dāng)前需要掌握的最重要的技術(shù)是什么? 這篇文章高度概括了你需要了解的技術(shù),,并附上了每個技術(shù)對應(yīng)的鏈接,,通過鏈接中內(nèi)容你可以詳細了解該技術(shù)。 記住,在學(xué)習(xí)的過程中一定要多動手寫代碼,。 你可以通過 Codepen.io 網(wǎng)站來交互式地寫代碼,;或者如果你在學(xué)習(xí)ES6的話,可以嘗試通過 Babel REPL來對其進行轉(zhuǎn)碼,。 這將會是一份很長的清單,,但請不要氣餒。相信自己,,你能夠做到的,!如果你看著這份清單,擔(dān)心到什么時候才能學(xué)會構(gòu)建現(xiàn)代應(yīng)用程序所需的一切,,請先移步 “Why I’m Thankful for JavaScript Fatigue”,。然后沉下心來開始我們的學(xué)習(xí): 關(guān)于“可選學(xué)習(xí)”的注意事項文章中的有些內(nèi)容是 可選的*,這里可選的意思是:如果你對這些內(nèi)容感興趣的話,,我向你推薦這些知識,;或者,找工作的時候可能會需要了解它們,,但是不是非得學(xué)習(xí)它們,。 任何標(biāo)有星號(如例*)的都是可選的。 任何沒有標(biāo)有 “*” 的內(nèi)容都需要學(xué)習(xí),,但不要覺得有義務(wù)去學(xué)習(xí)每項內(nèi)容,。你需要知道這些非可選的知識,但你不一定需要成為該主題絕對的專家,。 JavaScript 和 DOM 基礎(chǔ)在找一份JavaScript工作之前,,你應(yīng)該熟練掌握相關(guān)的JS基礎(chǔ)知識:
const doSomething = (err) => new Promise((resolve, reject) => {
if (err) return reject(err);
setTimeout(() => {
resolve(42);
}, 1000);
});
const log = value => console.log(value);
// Using returned promises
doSomething().then(
// on resolve:
log, // logs 42
// on reject (not called this time)
log
);
// remember to handle errors!
doSomething(new Error('oops'))
.then(log) // not called this time
.catch(log); // logs 'Error: oops'
使用工具
ReactReact 是一個JavaScript庫,用于構(gòu)建用戶界面,由Facebook創(chuàng)建. 它是基于單向數(shù)據(jù)流的概念, 意味著每個更新周期:
這是雙向數(shù)據(jù)綁定,,在DOM變化的地方可直接更新ID, DOM的變化可以直接更新數(shù)據(jù) (e.g., 類似Angular 1 和 Knockout). 使用雙向綁定, DOM渲染過程中對DOM的更新(稱為消化周期 Angular 1) 有可能在觸發(fā)繪圖階段之前就完成了, 這樣也造成回流和重繪?—?減慢了性能. React沒有規(guī)定數(shù)據(jù)管理系統(tǒng), 但是推薦使用 Flux-based. React’s ,,它是單向數(shù)據(jù)流的方法,借鑒于函數(shù)式編程不可變數(shù)據(jù)結(jié)構(gòu)改變了我們對前端框架結(jié)構(gòu)的思考方式. 更多關(guān)于 React & Flux 架構(gòu)的內(nèi)容請閱讀 “The Best Way to Learn to Code is to Code: Learn App Architecture by Building Apps”.
ReduxRedux 為你的 App 提供了事務(wù)的,、確定性狀態(tài)管理的功能。在 Redux 中,,可以對 action 對象流進行迭代來減少應(yīng)用的狀態(tài),。想要了解為什么這個問題很重要,請閱讀 “10 Tips for Better Redux Architecture.” ,。想要開始學(xué)習(xí) Redux ,,可以閱讀 Redux 創(chuàng)始人發(fā)布的超棒的教程。 Redux是必須掌握的一項知識, 即便是你在生產(chǎn)項目從來沒有使用過Redux . 為什么必須要掌握學(xué)習(xí)? 因為它會給你大量的經(jīng)驗和指導(dǎo),,讓你了解使用純函數(shù)和教你新的思考方式reducers的價值, 一般的函數(shù)編程遍歷集合的數(shù)據(jù),只是能提取一些值. Reducers 通常是用于數(shù)組原型方法 Reducers優(yōu)勢遠遠超越了僅僅使用數(shù)組,,它的作用對工作是很重要很有幫助,因此學(xué)習(xí)一種新的 Reducers知識是很有價值的.
Angular 2 *Angular 2 是谷歌開發(fā)的非常受歡迎的一個Angular框架. 因為它瘋狂的流行,它會使你的簡歷看著非常棒?—但是我強烈建議你首先學(xué)習(xí) React. 我有一些建議關(guān)于 React 超越 Angular 2 因為:
基于這些原因我建議你學(xué)習(xí)React, 我把 Angular 2 設(shè)置為可選學(xué)的*. 如果你有強烈的偏愛Angular 2 , 兩者隨意使用.首先 主要學(xué)習(xí)Angular 2 , 然后考慮React 選學(xué). 這兩個的任何一個都會是你的簡歷看起來很棒. 不論你選擇哪一個,試著去關(guān)注它至少6個月?—?1年之后再去學(xué)習(xí)另一個. 要真正精通是需要時間的歷練. RxJS*RxJS is JavaScript的響應(yīng)編程實用程序的集合. 認為這是lodash流. 響應(yīng)式編程已經(jīng)正式官方的進入JavaScript的使用場景. ECMAScript可見提案草案階段1, and RxJS 5 規(guī)范化標(biāo)準(zhǔn)的實現(xiàn). 我非常喜歡 RxJS,如果你只是一下子就把整件事全部導(dǎo)入, 它真的可以擴大你的包大小 (會產(chǎn)生很多的數(shù)據(jù)流量,套餐不夠用了). 為了減小bundle生產(chǎn)環(huán)境文件的大小, 不要導(dǎo)入所有程序接口. 使用補丁 imports, 替代: 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));
使用片段式導(dǎo)入減小和壓縮生產(chǎn)文件到~200k. 非常劃算. 它會使你的應(yīng)用程序更快. 編輯: 你為什么不列出<你最喜歡的 事>?有幾個人問我為什么沒有列出他們最喜歡的框架,。 我考慮的一個重要標(biāo)準(zhǔn) “這對實際工作有用嗎?”. 是的,,這是一個受歡迎的挑戰(zhàn), 這些有利條件用一個框架去開發(fā)一個重要的條件在哪里你花費你的學(xué)習(xí)時間長短. 為了回答這個問題,我看了一些關(guān)鍵指標(biāo),。 一,、谷歌趨勢。 如果你想看看谷歌趨勢圖, 記住按主題選擇, 不是關(guān)鍵詞, 僅僅靠幾個簡單的關(guān)鍵詞很難做出正確的判斷. 換句話說, 這些都是主題聚焦的趨勢, 不是關(guān)鍵字搜索: Google Trends 關(guān)于 JS 的主題 這個圖表告訴我們感興趣的幾個項目的信息。如果人們在搜索這些項目,,他們可能正在探索該選擇什么樣的項目,,或者是尋求幫助和文檔。這個是一個對項目受歡迎程度的一個比較不錯的指標(biāo),。 另外一個很好的數(shù)據(jù)來源是 Indeed.com,,這里匯集了來自各種源頭的招聘信息數(shù)據(jù)列表。近年來,,工作崗位的受歡迎程度急劇下降,,但是他們?nèi)匀皇占俗銐蚨嗟臄?shù)據(jù)來做相對的比較,可以告訴你人們在生產(chǎn)項目和工作中實際使用的技術(shù): 為了重現(xiàn)這些結(jié)果,,請搜索框架名稱 javascript,,然后讓地址欄為空。你就可以清晰的看到: Angular 和 React 占據(jù)主導(dǎo)地位:其他的暫時無法比擬,。(除了 jQuery ,,這是大量網(wǎng)站正在使用的框架,包括非 App,,因為它在幾乎所有的老舊系統(tǒng)中使用,,包括廣受歡迎的 CMS —— WordPress)。 你可能會看到 Angular 相比起 React 有較明顯的優(yōu)勢,。那為什么我會首先推薦 React 呢,?因為: 換句話說,React 贏得了媒體和客戶滿意度的戰(zhàn)斗,,如果這個勢頭繼續(xù)保持,,React 非常有機會能夠干掉 Angular ,成為前端框架的主導(dǎo),。 Angular 2 有機會扭轉(zhuǎn)這一局面,,所以它卷土重來,但是到目前為止,,React 還是打了一場很好的戰(zhàn)斗,。 需要關(guān)注的框架:
編者注:關(guān)于 MobX 和 Redux 的比較請閱讀這篇文章,。 緊接著下一步現(xiàn)在你已經(jīng)研究了這些熱門技術(shù), 閱讀 “如何在5個簡單步驟中開始你的第一個開發(fā)工作”. 提高你的JavaScript技能. 如果你還沒有進入角色, 你將會錯過很多. “JavaScript應(yīng)用程序編程”(O’Reilly) 的作者是埃里克·艾略特 , “學(xué)習(xí)JavaScript和Eric Elliott”. 他曾經(jīng)的軟件經(jīng)驗 Adobe 系統(tǒng), Zumba 健身, 《華爾街日報》, ESPN, 英國廣播公司, 頂級錄音藝術(shù)家包括 亞瑟,弗蘭克海洋,金屬樂隊, and many more. 他大部分時間都呆在舊金山灣,和世界上最漂亮的女人在一起. |
|
來自: Levy_X > 《WEB前端網(wǎng)站》