JD
職位描述
1.負責組件庫與業務頁面開發。
2.帶領團隊完成技術產品實現。
3.負責大型多應用架構設計。
4.利用前端技術與服務端協同完成團隊業務目標。
職位要求
1.熟練掌握JavaScript。
2.熟悉常用工程化工具，掌握模塊化思想和技術實現方案。
3.熟練掌握React前端框架，瞭解技術底層。同時瞭解vue以及angular等其他框架者優先。
4.熟練掌握react生態常用工具，redux/react-router等。
5.熟悉各種Web前端技術，包括HTML/XML/CSS等，有基於Ajax的前端應用開發經驗。
6.有良好的編碼習慣，對前端技術有持續的熱情，個性樂觀開朗,邏輯性強，善於和各種背景的人合作。
7.具有TS/移動設備上前端開發/NodeJS/服務端開發等經驗者優先。
翻譯一下JD
爲什麼起這個標題呢？因爲有很多人看到職位描述，可能就在和自己做的事情一一比對，把關鍵字都覈對上。而很多前端同學看到職位要求第一條裏的圖形學，可能就開始打退堂鼓了。或者看到幾個關鍵字自己都認識，就覺得沒問題，還挺簡單的。
就這樣望而卻步真的好嗎？爲什麼職位描述看着簡單，面試卻這麼難呢？你真的讀懂這份職位描述了嗎？
現在，不妨先停一下，就上面的問題，我們來細細品一下。什麼叫讀懂職位描述呢？從我個人的理解，讀懂職位描述，應該是讀懂這個職位需要哪些基礎能力，以及可能遇到哪些挑戰。我們寫自己簡歷的時候，“精通react”和“熟練使用react”，相信大家不會隨意去寫。同樣的，JD裏面的：掌握、熟練掌握、瞭解、熟悉，也不是隨意寫的，這代表了團隊對新同學的能力要求。
回想寫自己簡歷的時候，我們會對這個前綴捫心自問一下。因爲會擔心一旦寫了精通，面試官的問題會更難，甚至覺得只有源碼倒背如流的人，才能稱得上精通。當然也會有同學非常自信，用react做過幾個項目，就寫上了精通react。
這兩種都可以稱爲精通，也都不可以。沒有客觀標準，又怎麼去衡量呢？而標準在哪裏呢？所以在這裏，我從阿里面試官角度，給出我認爲的標準，儘可能的做到客觀可量化。那麼，基於上面這份職位標準，我來翻譯一下職位要求：
首先，總覽全部的要求，會發現這個職位雖然提到了3d相關的技能，但是大部分卻是應用開發相關的能力，所以這個職位並不是想找專業的3d領域同學，而是需要一個工程化能力強，對3d有了解的同學。
1.熟練掌握JavaScript。
初級：
JavaScript各種概念都得了解，《JavaScript語言精粹》這本書的目錄都得有概念，並且這些核心點都能脫口而出是什麼。這裏列舉一些做參考：
知道組合寄生繼承，知道class繼承。
知道怎麼創建類function + class。
知道閉包在實際場景中怎麼用，常見的坑。
知道模塊是什麼，怎麼用。
知道event loop是什麼，能舉例說明event loop怎麼影響平時的編碼。
掌握基礎數據結構，比如堆、棧、樹，並瞭解這些數據結構計算機基礎中的作用。
知道ES6數組相關方法，比如forEach，map，reduce。
中級：
知道class繼承與組合寄生繼承的差別，並能舉例說明。
知道event loop原理，知道宏微任務，並且能從個人理解層面說出爲什麼要區分。知道node和瀏覽器在實現loop時候的差別。
能將繼承、作用域、閉包、模塊這些概念融匯貫通，並且結合實際例子說明這幾個概念怎樣結合在一起。
能脫口而出2種以上設計模式的核心思想，並結合js語言特性舉例或口噴基礎實現。
掌握一些基礎算法核心思想或簡單算法問題，比如排序，大數相加。
2.熟悉常用工程化工具，掌握模塊化思想和技術實現方案。
初級：
知道webpack，rollup以及他們適用的場景。
知道webpack v4和v3的區別。
脫口而出webpack基礎配置。
知道webpack打包結果的代碼結構和執行流程，知道index.js，runtime.js是幹嘛的。
知道amd，cmd，commonjs，es module分別是什麼。
知道所有模塊化標準定義一個模塊怎麼寫。給出2個文件，能口噴一段代碼完成模塊打包和執行的核心邏輯。
中級：
知道webpack打包鏈路，知道plugin生命週期，知道怎麼寫一個plugin和loader。
知道常見loader做了什麼事情，能幾句話說明白，比如babel-loader，vue-loader。
能結合性能優化聊webpack配置怎麼做，能清楚說明白核心要點有哪些，並說明解決什麼問題，需要哪些外部依賴，比如cdn，接入層等。
瞭解異步模塊加載的實現原理，能口噴代碼實現核心邏輯。
高級：
能設計出或具體說明白團隊研發基礎設施。具體包括但不限於：
項目腳手架搭建，及如何以工具形態共享。
團隊eslint規範如何設計，及如何統一更新。
工具化打包發佈流程，包括本地調試、雲構建、線上發佈體系、一鍵部署能力。同時，方案不僅限於前端工程部分，包含相關服務端基礎設施，比如cdn服務搭建，接入層緩存方案設計，域名管控等。
客戶端緩存及預加載方案。
3.熟練掌握React前端框架，瞭解技術底層。同時瞭解vue以及angular等其他框架者優先。
初級：
知道react常見優化方案，脫口而出常用生命週期，知道他們是幹什麼的。
知道react大致實現思路，能對比react和js控制原生dom的差異，能口噴一個簡化版的react。
知道diff算法大致實現思路。
對state和props有自己的使用心得，結合受控組件、hoc等特性描述，需要說明各種方案的適用場景。
以上幾點react替換爲vue或angular同樣適用。
中級：
能說明白爲什麼要實現fiber，以及可能帶來的坑。
能說明白爲什麼要實現hook。
能說明白爲什麼要用immutable，以及用或者不用的考慮。
知道react不常用的特性，比如context，portal。
能用自己的理解說明白react like框架的本質，能說明白如何讓這些框架共存。
高級：
能設計出框架無關的技術架構。包括但不限於：
說明如何解決可能存在的衝突問題，需要結合實際案例。
能說明架構分層邏輯、各層的核心模塊，以及核心模塊要解決的問題。能結合實際場景例舉一些坑或者優雅的處理方案則更佳。
4.熟練掌握react生態常用工具，redux/react-router等。
初級：
知道react-router，redux，redux-thunk，react-redux，immutable，antd或同級別社區組件庫。
知道vue和angular對應全家桶分別有哪些。
知道瀏覽器react相關插件有什麼，怎麼用。
知道react-router v3/v4的差異。
知道antd組件化設計思路。
知道thunk幹嘛用的，怎麼實現的。
中級：
看過全家桶源碼，不要求每行都看，但是知道核心實現原理和底層依賴。能口噴幾行關鍵代碼把對應類庫實現即達標。
能從數據驅動角度透徹的說明白redux，能夠口噴原生js和redux結合要怎麼做。
能結合redux，vuex，mobx等數據流談談自己對vue和react的異同。
高級：
有基於全家桶構建複雜應用的經驗，比如最近很火的微前端和這些類庫結合的時候要注意什麼，會有什麼坑，怎麼解決