Web前端開發(fā)是現(xiàn)在互聯(lián)網(wǎng)行業(yè)中的一個(gè)熱門職位，對(duì)于想要進(jìn)入IT行業(yè)的小白來講，最在意的就是如何學(xué)好這門技術(shù)，其實(shí)想要學(xué)好前端沒有你想的那么難，只要注意以下幾點(diǎn)就可以了。

一、打好基礎(chǔ)

HTML、CSS、JavaScript 三大件，完全掌握。不懂得就直接查 MDN。

HTML重點(diǎn)掌握語義化。區(qū)分塊級(jí)和內(nèi)聯(lián)標(biāo)簽。其他查文檔就好了。還有就是定義 head 里面一些meta 了解下。

CSS。重點(diǎn)看盒子模型，定位，層級(jí)，過渡，動(dòng)畫和 transform。知道原理和規(guī)則。大部分工作都是照著設(shè)計(jì)稿化。掌握上面幾個(gè) 99% 還原也不難。接下來重點(diǎn)學(xué)習(xí)幾種常見的布局。完了之后去搞flex。最后搞下sass、less?；揪筒畈欢嗔恕?/p>

JavaScript。重點(diǎn)來了，紅寶書看一遍掌握基礎(chǔ)，進(jìn)階去看《你不知道的 JavaScript》。就這兩套足夠了，別搞那么多。

每個(gè)知識(shí)點(diǎn)搞懂。ES6 基本沒啥問題。下面幾個(gè)問題優(yōu)先搞懂，優(yōu)先級(jí)如下：

this 用法，相關(guān)原理

原型/原型鏈

閉包

面向?qū)ο笙嚓P(guān)

同步異步/回調(diào)/promise/async、await

模塊化 CommonJS, AMD

先搞這懂這些比較難的概念，對(duì)你JS理解更加深入。接下來在開始看框架方面：

二、框架方面

前期要會(huì)用，后期要懂原理。

新人先搞 Vue。Vue 算是上手容易的框架。照著官方文檔來問題不大。原理方面要提高自己認(rèn)識(shí)。學(xué)習(xí)怎么看源碼。github常去逛逛。

學(xué)習(xí)框架之前，我其實(shí)特別建議，新人先去了解 Babel 和 webpack 不僅僅是使用。一些原理方面的東西工作中也會(huì)用到。babel 里面會(huì)有教你如何編譯代碼。webpack 教你如和打包文件。自己手寫編譯器和打包工具也不是特別難。反正對(duì)之后看vue、react源碼幫助挺大。

搞完 Vue 全家桶，去了解下 React，React hooks 學(xué)習(xí)下新的理念。再回過頭來看Vue。你會(huì)發(fā)現(xiàn)他們是如此的相似去又不同。 多去實(shí)踐總結(jié)，對(duì)整體框架理解會(huì)越來越深刻。

三、如何看源碼

新人剛開始看源碼，會(huì)陷入兩個(gè)困境中。一是無從下手。二是看了之后感覺沒啥收獲。

這個(gè)也很正常。一般我們熟知的框架都有個(gè)幾千甚至上萬個(gè)PR。太大細(xì)節(jié)會(huì)干擾你。掌握整個(gè)節(jié)奏和流程。學(xué)習(xí)原理也比較吃力。就連找個(gè)入口都像大海撈針一樣。

建議從下面幾個(gè)方面入手：

1.挑簡(jiǎn)單的上手。別一開始就搞 vue、react、webpack。太難，會(huì)直接勸退新人。

2.不要為了面試而去讀。反而效果不好，面試稍微問深入一點(diǎn)就答不出來了。平時(shí)有興趣多琢磨琢磨。按照難易程度，函數(shù)庫(kù) < 組件庫(kù) < 框架 < 工程化 分別典型代表 lodash < vant < vue < webpack

3.手?jǐn)]簡(jiǎn)易模型。像vue, webpack, babel 都有簡(jiǎn)易項(xiàng)目給你擼。有的創(chuàng)始人（尤哥）還直播手?jǐn)]。國(guó)外的更多，youtube 一搜一大堆。就算不看源碼，照著寫出了簡(jiǎn)易 demo 對(duì)原理和理解提升都是很大的。

4.調(diào)試開源項(xiàng)目。先把項(xiàng)目拉下來。在vscode里面跑下，核心函數(shù)多打幾個(gè)斷點(diǎn)?？纯蠢锩孀兞渴窃趺磀iff的。 對(duì)理解更深刻了。

同任何學(xué)科一樣，“難的不會(huì)，會(huì)的不難”，入門簡(jiǎn)單的前端想要做好同樣困難。對(duì)于職場(chǎng)人來說，如果能夠保證自學(xué)的時(shí)間和效率，讓自己在前端上不斷精進(jìn)，那么這些難點(diǎn)當(dāng)然能夠一一解決。

以上就是本次分享的全部?jī)?nèi)容，想學(xué)習(xí)更多前端技巧，歡迎持續(xù)關(guān)注六星云課堂！