開篇

前端開發(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ū)告訴我鸡号。

一、JavaScript基礎(chǔ)

前端工程師吃飯的家伙须鼎，深度鲸伴、廣度一樣都不能差。

變量和類型

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

3.實現(xiàn)繼承的幾種方式以及他們的優(yōu)缺點

4.至少說出一種開源項目(如Node)中應用原型繼承的案例

5.可以描述 new一個對象的詳細過程品腹，手動實現(xiàn)一個 new操作符

6.理解es6class構(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.可以使用CanvasAPI腻要、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)缺點

三术吗、計算機基礎(chǔ)

關(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)asyncawait

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、ChildProcess等并理解其實現(xiàn)原理

4.Node的底層運行原理刽严、和瀏覽器的異同

5.Node事件驅(qū)動昂灵、非阻塞機制的實現(xiàn)原理

六、框架和類庫

輪子層出不窮港庄，從原理上理解才是正道

TypeScript

1.理解泛型倔既、接口等面向?qū)ο蟮南嚓P(guān)概念，TypeScript對面向?qū)ο罄砟畹膶崿F(xiàn)

2.理解使用TypeScript的好處鹏氧，掌握TypeScript基礎(chǔ)語法

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.ReactRouter和VueRouter的底層實現(xiàn)原理茸俭、動態(tài)加載實現(xiàn)原理

7.可熟練應用ReactAPI、生命周期等安皱，可應用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ā)

2.單頁面應用（SPA）的原理和優(yōu)缺點虹脯，掌握一種快速開發(fā)SPA的方案

3.理解Viewport、em奏候、rem的原理和用法循集，分辨率、px蔗草、ppi咒彤、dpi、dp的區(qū)別和實際應用

3.移動端頁面適配解決方案咒精、不同機型適配方案

4.掌握一種JavaScript移動客戶端開發(fā)技術(shù)镶柱，如ReactNative：可以搭建ReactNative開發(fā)環(huán)境，熟練進行開發(fā)狠轻，可理解ReactNative的運作原理奸例，不同端適配

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é)的進階知識，什么東西是搬運過來的继蜡，什么是干貨回俐，一目了然。

語言基礎(chǔ)

[??]JavaScript高級程序設計（必看）：https://book.douban.com/subject/10546125/

[??]高性能JavaScript：https://book.douban.com/subject/5362856/

現(xiàn)代JavaScript教程：https://zh.javascript.info/

阮一峰的ECMAScript6教程：http://es6.ruanyifeng.com/

ECMAScript6標準：https://www.ecma-international.org/ecma-262/6.0/

HTML meta標簽總結(jié)與屬性使用介紹：https://segmentfault.com/a/1190000004279791

CSS編碼指導：https://github.com/chadluo/CSS-Guidelines/blob/master/README.md

計算機基礎(chǔ)

大前端開發(fā)者需要了解的基礎(chǔ)編譯原理和語言知識：http://fullstack.blog/2017/06/24/%E5%A4%A7%E5%89%8D%E7%AB%AF%E5%BC%80%E5%8F%91%E8%80%85%E9%9C%80%E8%A6%81%E4%BA%86%E8%A7%A3%E7%9A%84%E5%9F%BA%E7%A1%80%E7%BC%96%E8%AF%91%E5%8E%9F%E7%90%86%E5%92%8C%E8%AF%AD%E8%A8%80%E7%9F%A5%E8%AF%86

圖解HTTP：https://book.douban.com/subject/25863515/

[??]JavaScript設計模式與開發(fā)實踐：https://book.douban.com/subject/26382780/

正則表達式30分鐘入門教程：https://link.juejin.im/?target=https%3A%2F%2Fdeerchao.net%2Ftutorials%2Fregex%2Fregex.htm

數(shù)據(jù)結(jié)構(gòu)和算法

數(shù)據(jù)結(jié)構(gòu)與算法之美：https://time.geekbang.org/column/intro/126

用動畫的形式呈現(xiàn)解LeetCode題目的思路：https://github.com/MisterBooo/LeetCodeAnimation

JavaScript數(shù)據(jù)結(jié)構(gòu)和算法：https://github.com/ConardLi/awesome-coding-js

30-seconds-of-code（里面有很多js代碼非常巧妙稀并，我正在將它翻譯成中文）：https://github.com/ConardLi/30-seconds-of-code-Zh-CN

運行環(huán)境

《重學前端》中的瀏覽器原理章節(jié)：https://time.geekbang.org/column/article/80240

圖解瀏覽器的基本工作原理：https://zhuanlan.zhihu.com/p/47407398

七天學會NodeJS：https://github.com/nqdeng/7-days-nodejs

Node.js模塊加載與運行原理：https://efe.baidu.com/blog/nodejs-module-analyze/

框架和類庫

TypeScriptHandbook：https://zhongsp.gitbooks.io/typescript-handbook/content/

React.js小書：http://huziketang.mangojuice.top/books/react/

React深入系列：https://juejin.im/post/5cad39b3f265da03502b1c0a

WebpackReact小書：https://fakefish.github.io/react-webpack-cookbook/index.html

Vue.js技術(shù)揭秘：https://github.com/ustbhuangyi/vue-analysis

Vuex-在Vue中管理狀態(tài)：https://sabe.io/tutorials/getting-started-with-vuex

你需要Mobx還是Redux仅颇？：https://juejin.im/post/5a7fd72c5188257a766324ae

Underscore源碼分析：https://yoyoyohamapi.gitbooks.io/undersercore-analysis/content/

微信小程序開發(fā)資源匯總：https://github.com/justjavac/awesome-wechat-weapp

騰訊移動Web前端知識庫：https://github.com/AlloyTeam/Mars

前端工程

一口（很長的）氣了解babel：https://zhuanlan.zhihu.com/p/43249121

Webpack傻瓜式指南：https://zhuanlan.zhihu.com/p/20367175

Webpack原理：https://segmentfault.com/a/1190000015088834?utm_source=tag-newest

廖雪峰的git教程：https://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b000

圖解Git：https://marklodato.github.io/visual-git-guide/index-zh-cn.html

前端開發(fā)者必備的Nginx知識：https://juejin.im/post/5c85a64d6fb9a04a0e2e038c

使用Jenkins進行持續(xù)集成：https://www.liaoxuefeng.com/article/001463233913442cdb2d1bd1b1b42e3b0b29eb1ba736c5e000

項目和業(yè)務

常見六大Web安全攻防解析：https://github.com/ljianshu/Blog/issues/56

深入理解前端性能監(jiān)控：https://juejin.im/post/5caaacc0e51d452b45296487#heading-5

[??]高性能網(wǎng)站建設指南：https://book.douban.com/subject/3132277/

新人如何快速融入技術(shù)實力強的前端團隊：https://juejin.im/post/5cb860a86fb9a06890705f14

學習提升

印記中文（各種中文開發(fā)文檔）：https://www.docschina.org/

前端學習方法：https://github.com/helloqingfeng/Awsome-Front-End-learning-resource/tree/master/01-FE-learning-master

如何在工作內(nèi)外獲得持續(xù)的技術(shù)成長：https://juejin.im/post/5cbd7477f265da039d32834e

優(yōu)秀的前端博客匯總：https://github.com/foru17/front-end-collect

另外推薦我一直在關(guān)注的幾位大佬的個人博客：

冴羽的博客：https://github.com/mqyqingfeng/Blog

張鑫旭的博客：https://www.zhangxinxu.com/wordpress/

左耳朵耗子：https://coolshell.cn/

技術(shù)之外

互聯(lián)網(wǎng)術(shù)語大全：http://www.reibang.com/p/9a7ca206c1ab

互聯(lián)網(wǎng)溝通、問答碘举、學習的藝術(shù)：https://zhuanlan.zhihu.com/p/41431775

經(jīng)常加班至深夜忘瓦，怎樣才能保持身體健康：https://www.zhihu.com/question/21790919

其實在這個信息發(fā)達的時代最不缺的就是資源，如何從眾多的資源中獲取到真正精華的部分引颈，是非常重要的耕皮，資源在于精不在于多，強烈建議在保證深度的情況下再保證廣度蝙场。