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的異同。
高級:
有基于全家桶構建復雜應用的經驗,比如最近很火的微前端和這些類庫結合的時候要注意什么,會有什么坑,怎么解決