一名【合格】前端工程師的自檢清單
2.2k 次閱讀 · 讀完需要 47 分鐘
287
開篇
前端開發(fā)是一個非常特殊的行業(yè)新蟆，它的歷史實際上不是很長赂摆，但是知識之繁雜，技術(shù)迭代速度之快是其他技術(shù)所不能比擬的录择。
winter在他的《重學前端》課程中提到：
到現(xiàn)在為止桦卒，前端工程師已經(jīng)成為研發(fā)體系中的重要崗位之一雳灵。可是闸盔，與此相對的是悯辙，我發(fā)現(xiàn)極少或者幾乎沒有大學的計算機專業(yè)愿意開設前端課程，更沒有系統(tǒng)性的教學方案出現(xiàn)迎吵。大部分前端工程師的知識躲撰，其實都是來自于實踐和工作中零散的學習。
這樣是一個非常真實的現(xiàn)狀击费，實際上很多前端開發(fā)者都是自學甚至轉(zhuǎn)行過來的拢蛋，前端入門簡單，學習了幾個API以后上手做項目也很簡單蔫巩，但是這往往成為了限制自身發(fā)展的瓶頸谆棱。
只是停留在會用階段是遠遠不夠的快压，我們還需要不斷探索和深入。現(xiàn)在市面上并不缺少學習教程垃瞧，技術(shù)文章蔫劣，如果盲目的學習你會發(fā)現(xiàn)看過以后的知識留存率會很低，而且發(fā)現(xiàn)沒有了解到的知識越來越多个从，這會讓人產(chǎn)生焦慮脉幢。
實際上，除了堅持學習的強大的自驅(qū)力嗦锐，你還需要一個很簡單的學習方法嫌松。那就是：建立自己的知識體系。它能幫助你更系統(tǒng)性的學習奕污，同時你也時刻能知道自己哪些地方是不足的萎羔。
我會把我工作和學習中接觸到的知識全部歸納到我的知識體系中，其中不僅僅包括我已經(jīng)學過的碳默，還有很多我沒有來得及學習的贾陷。
這不僅僅是我的知識體系，更是我時刻提醒自己的自檢清單腻窒。
下面我會把我的自檢清單分享給大家昵宇，你可以按照清單上的知識檢測自己還有哪些不足和提升，我也建議大家建自己的知識體系儿子，這樣工作或者學習甚至面試時瓦哎，你能快速定位到知識清單中的點，如果你有哪些我沒歸納到的點柔逼，歡迎在評論區(qū)告訴我蒋譬。
[圖片上傳失敗...(image-455ff2-1556508366096)]
一、JavaScript基礎
前端工程師吃飯的家伙愉适，深度犯助、廣度一樣都不能差。
變量和類型
- 1.
JavaScript規(guī)定了幾種語言類型 - 2.
JavaScript對象的底層數(shù)據(jù)結(jié)構(gòu)是什么 - 3.
Symbol類型在實際開發(fā)中的應用维咸、可手動實現(xiàn)一個簡單的Symbol - 4.
JavaScript中的變量在內(nèi)存中的具體存儲形式 - 5.基本類型對應的內(nèi)置對象剂买，以及他們之間的裝箱拆箱操作
- 6.理解值類型和引用類型
- 7.
null和undefined的區(qū)別 - 8.至少可以說出三種判斷
JavaScript數(shù)據(jù)類型的方式，以及他們的優(yōu)缺點癌蓖，如何準確的判斷數(shù)組類型 - 9.可能發(fā)生隱式類型轉(zhuǎn)換的場景以及轉(zhuǎn)換原則瞬哼，應如何避免或巧妙應用
- 10.出現(xiàn)小數(shù)精度丟失的原因，
JavaScript可以存儲的最大數(shù)字租副、最大安全數(shù)字坐慰，JavaScript處理大數(shù)字的方法、避免精度丟失的方法
原型和原型鏈
- 1.理解原型設計模式以及
JavaScript中的原型規(guī)則 - 2.
instanceof的底層實現(xiàn)原理用僧，手動實現(xiàn)一個instanceof - 4.實現(xiàn)繼承的幾種方式以及他們的優(yōu)缺點
- 5.至少說出一種開源項目(如
Node)中應用原型繼承的案例 - 6.可以描述
new一個對象的詳細過程结胀，手動實現(xiàn)一個new操作符 - 7.理解
es6 class構(gòu)造以及繼承的底層實現(xiàn)原理
作用域和閉包
- 1.理解詞法作用域和動態(tài)作用域
- 2.理解
JavaScript的作用域和作用域鏈 - 3.理解
JavaScript的執(zhí)行上下文棧赞咙，可以應用堆棧信息快速定位問題 - 4.
this的原理以及幾種不同使用場景的取值 - 5.閉包的實現(xiàn)原理和作用，可以列舉幾個開發(fā)中閉包的實際應用
- 6.理解堆棧溢出和內(nèi)存泄漏的原理糟港，如何防止
- 7.如何處理循環(huán)的異步操作
- 8.理解模塊化解決的實際問題攀操，可列舉幾個模塊化方案并理解其中原理
執(zhí)行機制
- 1.為何
try里面放return，finally還會執(zhí)行着逐，理解其內(nèi)部機制 - 2.
JavaScript如何實現(xiàn)異步編程崔赌，可以詳細描述EventLoop機制 - 3.宏任務和微任務分別有哪些
- 4.可以快速分析一個復雜的異步嵌套邏輯意蛀，并掌握分析方法
- 5.使用
Promise實現(xiàn)串行 - 6.
Node與瀏覽器EventLoop的差異 - 7.如何在保證頁面運行流暢的情況下處理海量數(shù)據(jù)
語法和API
- 1.理解
ECMAScript和JavaScript的關(guān)系 - 2.熟練運用
es5耸别、es6提供的語法規(guī)范， - 3.熟練掌握
JavaScript提供的全局對象（例如Date县钥、Math）秀姐、全局函數(shù)（例如decodeURI、isNaN）若贮、全局屬性（例如Infinity省有、undefined） - 4.熟練應用
map、reduce谴麦、filter等高階函數(shù)解決問題 - 5.
setInterval需要注意的點蠢沿，使用settimeout實現(xiàn)setInterval - 6.
JavaScript提供的正則表達式API、可以使用正則表達式（郵箱校驗匾效、URL解析舷蟀、去重等）解決常見問題 - 7.
JavaScript異常處理的方式，統(tǒng)一的異常處理方案
二面哼、HTML和CSS
HTML
- 1.從規(guī)范的角度理解
HTML野宜，從分類和語義的角度使用標簽 - 2.常用頁面標簽的默認樣式、自帶屬性魔策、不同瀏覽器的差異匈子、處理瀏覽器兼容問題的方式
- 3.元信息類標簽(
head、title闯袒、meta)的使用目的和配置方法 - 4.
HTML5離線緩存原理 - 5.可以使用
Canvas API虎敦、SVG等繪制高性能的動畫
CSS
- 1.
CSS盒模型，在不同瀏覽器的差異 - 2.
CSS所有選擇器及其優(yōu)先級政敢、使用場景其徙，哪些可以繼承，如何運用at規(guī)則 - 3.
CSS偽類和偽元素有哪些堕仔，它們的區(qū)別和實際應用 - 4.
HTML文檔流的排版規(guī)則擂橘，CSS幾種定位的規(guī)則、定位參照物摩骨、對文檔流的影響通贞，如何選擇最好的定位方式朗若，雪碧圖實現(xiàn)原理 - 5.水平垂直居中的方案、可以實現(xiàn)
6種以上并對比它們的優(yōu)缺點 - 6.
BFC實現(xiàn)原理昌罩，可以解決的問題哭懈，如何創(chuàng)建BFC - 7.可使用
CSS函數(shù)復用代碼，實現(xiàn)特殊效果 - 8.
PostCSS茎用、Sass遣总、Less的異同，以及使用配置轨功，至少掌握一種 - 9.
CSS模塊化方案旭斥、如何配置按需加載、如何防止CSS阻塞渲染 - 10.熟練使用
CSS實現(xiàn)常見動畫古涧，如漸變垂券、移動、旋轉(zhuǎn)羡滑、縮放等等 - 11.
CSS瀏覽器兼容性寫法菇爪，了解不同API在不同瀏覽器下的兼容性情況 - 12.掌握一套完整的響應式布局方案
手寫
- 1.手寫圖片瀑布流效果
- 2.使用
CSS繪制幾何圖形（圓形、三角形柒昏、扇形凳宙、菱形等） - 3.使用純
CSS實現(xiàn)曲線運動（貝塞爾曲線） - 4.實現(xiàn)常用布局（三欄、圣杯职祷、雙飛翼氏涩、吸頂），可是說出多種方式并理解其優(yōu)缺點
三堪旧、計算機基礎
關(guān)于編譯原理削葱，不需要理解非常深入，但是最基本的原理和概念一定要懂淳梦，這對于學習一門編程語言非常重要
編譯原理
- 1.理解代碼到底是什么析砸，計算機如何將代碼轉(zhuǎn)換為可以運行的目標程序
- 2.正則表達式的匹配原理和性能優(yōu)化
- 3.如何將
JavaScript代碼解析成抽象語法樹(AST) - 4.
base64的編碼原理 - 5.幾種進制的相互轉(zhuǎn)換計算方法，在
JavaScript中如何表示和轉(zhuǎn)換
網(wǎng)絡協(xié)議
- 1.理解什么是協(xié)議爆袍，了解
TCP/IP網(wǎng)絡協(xié)議族的構(gòu)成首繁，每層協(xié)議在應用程序中發(fā)揮的作用 - 2.三次握手和四次揮手詳細原理，為什么要使用這種機制
- 3.有哪些協(xié)議是可靠陨囊，
TCP有哪些手段保證可靠交付 - 4.
DNS的作用弦疮、DNS解析的詳細過程，DNS優(yōu)化原理 - 5.
CDN的作用和原理 - 6.
HTTP請求報文和響應報文的具體組成蜘醋，能理解常見請求頭的含義胁塞，有幾種請求方式，區(qū)別是什么 - 7.
HTTP所有狀態(tài)碼的具體含義，看到異常狀態(tài)碼能快速定位問題 - 8.
HTTP1.1啸罢、HTTP2.0帶來的改變 - 9.
HTTPS的加密原理编检，如何開啟HTTPS，如何劫持HTTPS請求 - 10.理解
WebSocket協(xié)議的底層原理扰才、與HTTP的區(qū)別
設計模式
- 1.熟練使用前端常用的設計模式編寫代碼允懂，如單例模式、裝飾器模式衩匣、代理模式等
- 2.發(fā)布訂閱模式和觀察者模式的異同以及實際應用
- 3.可以說出幾種設計模式在開發(fā)中的實際應用蕾总，理解框架源碼中對設計模式的應用
四、數(shù)據(jù)結(jié)構(gòu)和算法
據(jù)我了解的大部分前端對這部分知識有些欠缺琅捏，甚至抵觸生百，但是，如果突破更高的天花板午绳，這部分知識是必不可少的置侍，而且我親身經(jīng)歷——非常有用映之！
JavaScript編碼能力
- 1.多種方式實現(xiàn)數(shù)組去重拦焚、扁平化、對比優(yōu)缺點
- 2.多種方式實現(xiàn)深拷貝杠输、對比優(yōu)缺點
- 3.手寫函數(shù)柯里化工具函數(shù)赎败、并理解其應用場景和優(yōu)勢
- 4.手寫防抖和節(jié)流工具函數(shù)、并理解其內(nèi)部原理和應用場景
- 5.實現(xiàn)一個
sleep函數(shù)
手動實現(xiàn)前端輪子
- 1.手動實現(xiàn)
call蠢甲、apply僵刮、bind - 2.手動實現(xiàn)符合
Promise/A+規(guī)范的Promise、手動實現(xiàn)async await - 3.手寫一個
EventEmitter實現(xiàn)事件發(fā)布鹦牛、訂閱 - 4.可以說出兩種實現(xiàn)雙向綁定的方案搞糕、可以手動實現(xiàn)
- 5.手寫
JSON.stringify、JSON.parse - 6.手寫一個模版引擎曼追，并能解釋其中原理
- 7.手寫
懶加載窍仰、下拉刷新、上拉加載礼殊、預加載等效果
數(shù)據(jù)結(jié)構(gòu)
- 1.理解常見數(shù)據(jù)結(jié)構(gòu)的特點驹吮，以及他們在不同場景下使用的優(yōu)缺點
- 2.理解
數(shù)組、字符串的存儲原理晶伦，并熟練應用他們解決問題 - 3.理解
二叉樹碟狞、棧、隊列婚陪、哈希表的基本結(jié)構(gòu)和特點族沃，并可以應用它解決問題 - 4.了解
圖、堆的基本結(jié)構(gòu)和使用場景
算法
- 1.可計算一個算法的時間復雜度和空間復雜度，可估計業(yè)務邏輯代碼的耗時和內(nèi)存消耗
- 2.至少理解五種排序算法的實現(xiàn)原理脆淹、應用場景智润、優(yōu)缺點，可快速說出時間未辆、空間復雜度
- 3.了解遞歸和循環(huán)的優(yōu)缺點窟绷、應用場景、并可在開發(fā)中熟練應用
- 4.可應用
回溯算法咐柜、貪心算法兼蜈、分治算法、動態(tài)規(guī)劃等解決復雜問題 - 5.前端處理海量數(shù)據(jù)的算法方案
五拙友、運行環(huán)境
我們需要理清語言和環(huán)境的關(guān)系：
ECMAScript描述了JavaScript語言的語法和基本對象規(guī)范瀏覽器作為
JavaScript的一種運行環(huán)境为狸，為它提供了：文檔對象模型（DOM），描述處理網(wǎng)頁內(nèi)容的方法和接口遗契、瀏覽器對象模型（BOM）辐棒，描述與瀏覽器進行交互的方法和接口Node也是
JavaScript的一種運行環(huán)境，為它提供了操作I/O牍蜂、網(wǎng)絡等API
瀏覽器API
- 1.瀏覽器提供的符合
W3C標準的DOM操作API漾根、瀏覽器差異、兼容性 - 2.瀏覽器提供的瀏覽器對象模型 (
BOM)提供的所有全局API鲫竞、瀏覽器差異辐怕、兼容性 - 3.大量
DOM操作、海量數(shù)據(jù)的性能優(yōu)化(合并操作从绘、Diff寄疏、requestAnimationFrame等) - 4.瀏覽器海量數(shù)據(jù)存儲、操作性能優(yōu)化
- 5.
DOM事件流的具體實現(xiàn)機制僵井、不同瀏覽器的差異陕截、事件代理 - 6.前端發(fā)起網(wǎng)絡請求的幾種方式及其底層實現(xiàn)、可以手寫原生
ajax批什、fetch农曲、可以熟練使用第三方庫 - 7.瀏覽器的同源策略，如何避免同源策略渊季，幾種方式的異同點以及如何選型
- 8.瀏覽器提供的幾種存儲機制朋蔫、優(yōu)缺點、開發(fā)中正確的選擇
- 9.瀏覽器跨標簽通信
瀏覽器原理
- 1.各瀏覽器使用的
JavaScript引擎以及它們的異同點却汉、如何在代碼中進行區(qū)分 - 2.請求數(shù)據(jù)到請求結(jié)束與服務器進行了幾次交互
- 3.可詳細描述瀏覽器從輸入
URL到頁面展現(xiàn)的詳細過程 - 4.瀏覽器解析
HTML代碼的原理驯妄，以及構(gòu)建DOM樹的流程 - 5.瀏覽器如何解析
CSS規(guī)則，并將其應用到DOM樹上 - 6.瀏覽器如何將解析好的帶有樣式的
DOM樹進行繪制 - 7.瀏覽器的運行機制合砂，如何配置資源異步同步加載
- 8.瀏覽器回流與重繪的底層原理青扔，引發(fā)原因，如何有效避免
- 9.瀏覽器的垃圾回收機制，如何避免內(nèi)存泄漏
- 10.瀏覽器采用的緩存方案微猖，如何選擇和控制合適的緩存方案
Node
- 1.理解
Node在應用程序中的作用谈息，可以使用Node搭建前端運行環(huán)境、使用Node操作文件凛剥、操作數(shù)據(jù)庫等等 - 2.掌握一種
Node開發(fā)框架侠仇，如Express，Express和Koa的區(qū)別 - 3.熟練使用
Node提供的API如Path犁珠、Http逻炊、Child Process等并理解其實現(xiàn)原理 - 4.
Node的底層運行原理、和瀏覽器的異同 - 5.
Node事件驅(qū)動犁享、非阻塞機制的實現(xiàn)原理
六余素、框架和類庫
輪子層出不窮，從原理上理解才是正道
TypeScript
- 1.理解
泛型炊昆、接口等面向?qū)ο蟮南嚓P(guān)概念桨吊，TypeScript對面向?qū)ο罄砟畹膶崿F(xiàn) - 2.理解使用
TypeScript的好處，掌握TypeScript基礎語法 - 3.
TypeScript的規(guī)則檢測原理 - 4.可以在
React凤巨、Vue等框架中使用TypeScript進行開發(fā)
React
- 1.
React和vue選型和優(yōu)缺點视乐、核心架構(gòu)的區(qū)別 - 2.
React中setState的執(zhí)行機制，如何有效的管理狀態(tài) - 3.
React的事件底層實現(xiàn)機制 - 4.
React的虛擬DOM和Diff算法的內(nèi)部實現(xiàn) - 5.
React的Fiber工作原理磅甩，解決了什么問題 - 6.
React Router和Vue Router的底層實現(xiàn)原理炊林、動態(tài)加載實現(xiàn)原理 - 7.可熟練應用
React API、生命周期等卷要，可應用HOC、render props独榴、Hooks等高階用法解決問題 - 8.基于
React的特性和原理僧叉，可以手動實現(xiàn)一個簡單的React
Vue
- 1.熟練使用
Vue的API、生命周期棺榔、鉤子函數(shù) - 2.
MVVM框架設計理念 - 3.
Vue雙向綁定實現(xiàn)原理瓶堕、Diff算法的內(nèi)部實現(xiàn) - 4.
Vue的事件機制 - 5.從
template轉(zhuǎn)換成真實DOM的實現(xiàn)機制
多端開發(fā)
- 1.單頁面應用（
SPA）的原理和優(yōu)缺點，掌握一種快速開發(fā)SPA的方案 - 2.理解
Viewport症歇、em郎笆、rem的原理和用法，分辨率忘晤、px宛蚓、ppi、dpi设塔、dp的區(qū)別和實際應用 - 3.移動端頁面適配解決方案凄吏、不同機型適配方案
- 4.掌握一種
JavaScript移動客戶端開發(fā)技術(shù)，如React Native：可以搭建React Native開發(fā)環(huán)境，熟練進行開發(fā)痕钢，可理解React Native的運作原理图柏，不同端適配 - 5.掌握一種
JavaScriptPC客戶端開發(fā)技術(shù)，如Electron：可搭建Electron開發(fā)環(huán)境任连，熟練進行開發(fā)蚤吹，可理解Electron的運作原理 - 6.掌握一種小程序開發(fā)框架或原生小程序開發(fā)
- 7.理解多端框架的內(nèi)部實現(xiàn)原理，至少了解一個多端框架的使用
數(shù)據(jù)流管理
- 1.掌握
React和Vue傳統(tǒng)的跨組件通信方案随抠，對比采用數(shù)據(jù)流管理框架的異同 - 2.熟練使用
Redux管理數(shù)據(jù)流距辆，并理解其實現(xiàn)原理，中間件實現(xiàn)原理 - 3.熟練使用
Mobx管理數(shù)據(jù)流暮刃，并理解其實現(xiàn)原理跨算，相比Redux有什么優(yōu)勢 - 4.熟練使用
Vuex管理數(shù)據(jù)流，并理解其實現(xiàn)原理 - 5.以上數(shù)據(jù)流方案的異同和優(yōu)缺點椭懊，不情況下的技術(shù)選型
實用庫
- 1.至少掌握一種
UI組件框架诸蚕，如antd design，理解其設計理念氧猬、底層實現(xiàn) - 2.掌握一種圖表繪制框架背犯，如
Echart，理解其設計理念盅抚、底層實現(xiàn)漠魏，可以自己實現(xiàn)圖表 - 3.掌握一種
GIS開發(fā)框架，如百度地圖API - 4.掌握一種可視化開發(fā)框架妄均，如
Three.js柱锹、D3 - 5.工具函數(shù)庫，如
lodash丰包、underscore禁熏、moment等，理解使用的工具類或工具函數(shù)的具體實現(xiàn)原理
開發(fā)和調(diào)試
- 1.熟練使用各瀏覽器提供的調(diào)試工具
- 2.熟練使用一種代理工具實現(xiàn)請求代理邑彪、抓包瞧毙，如
charls - 3.可以使用
Android、IOS模擬器進行調(diào)試寄症，并掌握一種真機調(diào)試方案 - 4.了解
Vue宙彪、React等框架調(diào)試工具的使用
七、前端工程
前端工程化：以工程化方法和工具提高開發(fā)生產(chǎn)效率有巧、降低維護難度
項目構(gòu)建
- 1.理解
npm释漆、yarn依賴包管理的原理，兩者的區(qū)別 - 2.可以使用
npm運行自定義腳本 - 3.理解
Babel剪决、ESLint灵汪、webpack等工具在項目中承擔的作用 - 4.
ESLint規(guī)則檢測原理檀训，常用的ESLint配置 - 5.
Babel的核心原理，可以自己編寫一個Babel插件 - 6.可以配置一種前端代碼兼容方案享言，如
Polyfill - 7.
Webpack的編譯原理峻凫、構(gòu)建流程、熱更新原理览露，chunk荧琼、bundle和module的區(qū)別和應用 - 8.可熟練配置已有的
loaders和plugins解決問題，可以自己編寫loaders和plugins
nginx
- 1.正向代理與反向代理的特點和實例
- 2.可手動搭建一個簡單的
nginx服務器差牛、 - 3.熟練應用常用的
nginx內(nèi)置變量命锄，掌握常用的匹配規(guī)則寫法 - 4.可以用
nginx實現(xiàn)請求過濾、配置gzip偏化、負載均衡等脐恩，并能解釋其內(nèi)部原理
開發(fā)提速
- 1.熟練掌握一種接口管理、接口
mock工具的使用侦讨，如yapi - 2.掌握一種高效的日志埋點方案驶冒，可快速使用日志查詢工具定位線上問題
- 3.理解
TDD與BDD模式，至少會使用一種前端單元測試框架
版本控制
- 1.理解
Git的核心原理韵卤、工作流程骗污、和SVN的區(qū)別 - 2.熟練使用常規(guī)的
Git命令、git rebase沈条、git stash等進階命令 - 3.可以快速解決
線上分支回滾需忿、線上分支錯誤合并等復雜問題
持續(xù)集成
- 1.理解
CI/CD技術(shù)的意義，至少熟練掌握一種CI/CD工具的使用蜡歹，如Jenkins - 2.可以獨自完成架構(gòu)設計屋厘、技術(shù)選型、環(huán)境搭建季稳、全流程開發(fā)擅这、部署上線等一套完整的開發(fā)流程（包括
Web應用、移動客戶端應用景鼠、PC客戶端應用、小程序痹扇、H5等等）
八铛漓、項目和業(yè)務
后端技能
- 1.了解后端的開發(fā)方式，在應用程序中的作用鲫构，至少會使用一種后端語言
- 2.掌握數(shù)據(jù)最終在數(shù)據(jù)庫中是如何落地存儲的浓恶，能看懂表結(jié)構(gòu)設計、表之間的關(guān)聯(lián)结笨，至少會使用一種數(shù)據(jù)庫
性能優(yōu)化
- 1.了解前端性能衡量指標包晰、性能監(jiān)控要點湿镀，掌握一種前端性能監(jiān)控方案
- 2.了解常見的
Web、App性能優(yōu)化方案 - 3.
SEO排名規(guī)則伐憾、SEO優(yōu)化方案勉痴、前后端分離的SEO - 4.
SSR實現(xiàn)方案、優(yōu)缺點树肃、及其性能優(yōu)化 - 5.
Webpack的性能優(yōu)化方案 - 6.
Canvas性能優(yōu)化方案 - 7.
React蒸矛、Vue等框架使用性能優(yōu)化方案
前端安全
- 1.
XSS攻擊的原理、分類胸嘴、具體案例雏掠，前端如何防御 - 2.
CSRF攻擊的原理、具體案例劣像，前端如何防御 - 3.
HTTP劫持乡话、頁面劫持的原理、防御措施
業(yè)務相關(guān)
- 1.能理解所開發(fā)項目的整體業(yè)務形態(tài)耳奕、業(yè)務目標绑青、業(yè)務架構(gòu)，可以快速定位線上業(yè)務問題
- 2.能理解所開發(fā)項目整體的技術(shù)架構(gòu)吮铭、能快讀的根據(jù)新需求進行開發(fā)規(guī)劃时迫、能快速根據(jù)業(yè)務報警、線上日志等定位并解決線上技術(shù)問題
- 3.可以將自己的想法或新技術(shù)在業(yè)務中落地實踐谓晌，盡量在團隊中擁有一定的不可替代性
九掠拳、學習提升
vczh大神在知乎問題【如何能以后達到溫趙輪三位大神的水平？】下的回答：
這十幾年我一共做了三件事：
- 1纸肉、不以賺錢為目的選擇學習的內(nèi)容溺欧；
- 2、以自己是否能造出輪子來衡量學習的效果柏肪；
- 3姐刁、堅持每天寫自己的代碼，前10年每天至少6個小時烦味，不包含學習和工作的時間聂使。
上面幾點可能有點難，第一點我就做不到谬俄，但是做到下面績點還是比較容易的柏靶。
關(guān)于寫博客說明下，能給別人講明白的知識會比自己學習掌握的要深刻許多
- 1.擁有自己的技術(shù)博客溃论，或者在一些博客平臺上擁有自己的專欄
- 2.定期的將知識進行總結(jié)屎蜓，不斷完善自己的知識體系
- 3.盡量將自己的知識轉(zhuǎn)換成真實的產(chǎn)出，不要僅僅停留在書面理解層面，更重要的是實際應用
- 4.堅持輸出
自己的代碼棚饵，不要盲目的扎進公司業(yè)
十、技術(shù)之外
這部分可能比上面九條加起來重要忿族！
- 1.了解互聯(lián)網(wǎng)人員術(shù)語：
CEO扼劈、CTO驻啤、COO、CFO测僵、PM街佑、QA、UI捍靠、FE沐旨、DEV、DBA榨婆、OPS等 - 2.了解互聯(lián)網(wǎng)行業(yè)術(shù)語：
B2B磁携、B2C、C2C良风、O2O等 - 3.掌握互聯(lián)網(wǎng)行業(yè)溝通谊迄、問答、學習的
- 4.有一定的
"PPT"能力 - 5.有一定的理財意識烟央，至少了解儲蓄统诺、貨幣基金、保險疑俭、指數(shù)基金粮呢、股票等基本的理財知識
- 6.掌握在繁重的工作和長期的電腦輻射的情況下保持健康的方法，建立正確的養(yǎng)生知識體系
十一钞艇、資源推薦
有了知識體系啄寡，在閱讀一篇技術(shù)文章的時候就很容易把它歸類，我一直以來就是這樣做的哩照。
事實證明挺物，在閱讀文章或書籍時，有目的和歸類的閱讀比"隨便看看"后的只是留存率要高很多飘弧。
每閱讀到一篇好的文章或者書籍识藤，我都會收藏并歸類到我的知識體系中。
下面是一些我覺得還不錯的文章次伶、博客或者書籍教程等等蹋岩，分享給大家，資源不多学少，但都是精品。
學習一門知識秧骑，最好先閱讀官方文檔版确，把所有的API大概瀏覽一遍扣囊，再繼續(xù)看大佬們總結(jié)的進階知識，什么東西是搬運過來的绒疗，什么是干貨侵歇，一目了然。
語言基礎
- [??]
JavaScript高級程序設計（必看）：https://book.douban.com/subje... - [??]高性能
JavaScript：https://book.douban.com/subje... - 現(xiàn)代
JavaScript教程：https://zh.javascript.info/ - 阮一峰的
ECMAScript 6教程：http://es6.ruanyifeng.com/ -
ECMAScript 6標準：https://www.ecma-internationa... -
HTML meta標簽總結(jié)與屬性使用介紹：https://segmentfault.com/a/11... -
CSS編碼指導：https://github.com/chadluo/CS...
計算機基礎
- 大前端開發(fā)者需要了解的基礎編譯原理和語言知識：http://fullstack.blog/2017/06...
- 圖解
HTTP：https://book.douban.com/subje... - [??]
JavaScript設計模式與開發(fā)實踐：https://book.douban.com/subje... - 正則表達式30分鐘入門教程：https://link.juejin.im/?targe...
數(shù)據(jù)結(jié)構(gòu)和算法
- 數(shù)據(jù)結(jié)構(gòu)與算法之美：https://time.geekbang.org/col...
- 用動畫的形式呈現(xiàn)解
LeetCode題目的思路：https://github.com/MisterBooo... -
JavaScript數(shù)據(jù)結(jié)構(gòu)和算法：https://github.com/ConardLi/a... -
30-seconds-of-code（里面有很多js代碼非常巧妙吓蘑，我正在將它翻譯成中文）：https://github.com/ConardLi/3...
運行環(huán)境
- 《重學前端》中的瀏覽器原理章節(jié)：https://time.geekbang.org/col...
- 圖解瀏覽器的基本工作原理：https://zhuanlan.zhihu.com/p/...
- 七天學會
NodeJS：https://github.com/nqdeng/7-d... -
Node.js模塊加載與運行原理：https://efe.baidu.com/blog/no...
框架和類庫
-
TypeScript Handbook：https://zhongsp.gitbooks.io/t... -
React.js小書：http://huziketang.mangojuice.... -
React深入系列：https://juejin.im/post/5cad39... -
Webpack React小書：https://fakefish.github.io/re... -
Vue.js技術(shù)揭秘：https://github.com/ustbhuangy... -
Vuex-在Vue中管理狀態(tài)：https://sabe.io/tutorials/get... - 你需要
Mobx還是Redux惕虑？：https://juejin.im/post/5a7fd7... -
Underscore源碼分析：https://yoyoyohamapi.gitbooks... - 微信小程序開發(fā)資源匯總：https://github.com/justjavac/...
- 騰訊移動
Web前端知識庫：https://github.com/AlloyTeam/...
前端工程
- 一口（很長的）氣了解
babel：https://zhuanlan.zhihu.com/p/... -
Webpack傻瓜式指南：https://zhuanlan.zhihu.com/p/... -
Webpack原理：https://segmentfault.com/a/11... - 廖雪峰的
git教程：https://www.liaoxuefeng.com/w... - 圖解
Git：https://marklodato.github.io/... - 前端開發(fā)者必備的
Nginx知識：https://juejin.im/post/5c85a6... - 使用Jenkins進行持續(xù)集成：https://www.liaoxuefeng.com/a...
項目和業(yè)務
- 常見六大
Web安全攻防解析：https://github.com/ljianshu/B... - 深入理解前端性能監(jiān)控：https://juejin.im/post/5caaac...
- [??]高性能網(wǎng)站建設指南：https://book.douban.com/subje...
- 新人如何快速融入技術(shù)實力強的前端團隊：https://juejin.im/post/5cb860...
學習提升
- 印記中文（各種中文開發(fā)文檔）：https://www.docschina.org/
- 前端學習方法：https://github.com/helloqingf...
- 如何在工作內(nèi)外獲得持續(xù)的技術(shù)成長：https://juejin.im/post/5cbd74...
- 優(yōu)秀的前端博客匯總：https://github.com/foru17/fro...
另外推薦我一直在關(guān)注的幾位大佬的個人博客：
- 冴羽的博客：https://github.com/mqyqingfen...
- 張鑫旭的博客：https://www.zhangxinxu.com/wo...
- 左耳朵耗子：https://coolshell.cn/
技術(shù)之外
- 互聯(lián)網(wǎng)術(shù)語大全：http://www.reibang.com/p/9a7...
- 互聯(lián)網(wǎng)溝通、問答磨镶、學習的藝術(shù)：https://zhuanlan.zhihu.com/p/...
- 經(jīng)常加班至深夜溃蔫，怎樣才能保持身體健康：https://www.zhihu.com/questio...
其實在這個信息發(fā)達的時代最不缺的就是資源，如何從眾多的資源中獲取到真正精華的部分琳猫，是非常重要的伟叛，資源在于精不在于多，強烈建議在保證深度的情況下再保證廣度脐嫂。
小結(jié)
希望你閱讀本篇文章后可以達到以下幾點：
- 從知識清單中找到自己的知識盲點與欠缺
- 具有知識體系化的思想统刮，開始建立自己的知識體系
- 閱讀文章時將知識歸類到知識體系中，并不斷完善自己的知識體系
- 從文章中獲取到了有用的資源
文中如有錯誤账千，歡迎在評論區(qū)指正侥蒙，如果這篇文章幫助到了你，歡迎點贊和關(guān)注匀奏。
如果你有什么好的知識鞭衩、資源推薦，歡迎在評論區(qū)留言攒射。
想閱讀更多優(yōu)質(zhì)文章醋旦、下載文章中思維導圖源文件、可關(guān)注我的github博客会放，后續(xù)的文章我也會按照知識清單來寫饲齐，你的star?、點贊和關(guān)注是我持續(xù)創(chuàng)作的動力咧最！
