JavaScript高效學習之路總結篇

1.首先我會把Chrome瀏覽器裝好，在dev tools => console裡直接練習熟悉基本語法，變量，數據類型，數學運算，字符串運算，條件，循環基本結構，簡單函數定義和調用這些，之所以用chrome dev tools，是因為這時候我不想費勁折騰單獨的編輯器，也不需要在開文件和文件夾，然後去配一些工具最終才接觸到真正的JS編程，我想盡可能直接而少干擾就開始寫JS，這是最重要的，我學JS，當然應該盡快寫JS

2.熟悉了基本語法以後，我會在devtools => console 裡編幾個稍微有挑戰點的小程序，比如實現fibonaci 數列這種簡單的，比如打印一個99乘法表，你也可以自己給自己出幾個題，或者網路上隨機找有興趣的題目，別人寫過沒寫過不是重點，重點是找點事情做，讓自己寫程式碼，別小看這些看起來無聊的程序，在你的熟練度達到可以開始第一個在專案之前，這些沒有的小程式是最適合練手的，因為它們不牽涉其他方面的知識（例如DOM），所以你不會受到過多幹擾，只需要專注於用正確的語法寫出正確的程序，這個過程會讓你更熟悉JS語言本身。

3.我覺得差不多的時候，就可以學習用JS來做web開發了，但是別急，這時候還沒準備好新建一個項目，所以我還是會在devtools裡，但是側重是熟悉DOM，我會從簡單的window.alert, window.prompt 開始，慢慢地去試驗DOM的API如何使用，我會買一本DOM編程的書，放在案頭，一章一章往下看，邊看邊試，慢慢地接觸到DOM的常用操作，例如document.getElementById, document.getElementsByClassName, addEventListner, 等等，這些呼叫裡面有很重要的概念，例如什麼是ID，什麼是Class，什麼是Event ，它們有什麼用，JS語言是如何透過API和它們互動的。我會選幾個網站的頁面，隨便對頁面的元素做一些修改，例如用JS改變元素的字體，背景色，或是臨時增加事件偵聽等等。 DOM API的行為產生的效果你能在網頁上直接看出來，很直觀，也比較有趣，比之前寫純JS程式這些更生動，能激發學習的好奇心，並且DOM是JS程式設計師的核心知識。

4.通常看完一本DOM程式設計的書以後，大概地了解了JS在web程式設計中的用處了。這時候我會為自己選一個項目，像是留言版這種，以HTML5 Boilerplate為模板，開始第一個web前端專案的開發。資料的儲存可以直接存放在IndexDB裡，所以這時候不需要關心後台操作。我會大概的考慮好要做什麼功能，然後用之前學到的JS和DOM操作的知識，好好實現這些功能。這個專案會花去我大量的時間，所以我告訴自己要保持耐心。碰到問題我就去用搜尋引擎找答案，或是去書裡找對應的章節。

5.寫完第一個項目以後，我會第一次覺得很有成就感，雖然項目很小，也不複雜。我會找一個老師幫我review一下，聽聽他的意見和建議，也可以準備一些問題，讓他幫忙看接下去可以怎麼迭代。這時候我會去學習git的基本操作，github的基本使用，然後把專案push上去，把需要的改動commit進git。

6.在這之前我寫的都是原生JS，沒有用到庫，沒有用到框架，這樣的好處是我不需要過早地去糾結庫和框架本身的概念，因為現在真正重要的是JS語言本身，其實我的程式領域比起最開始已經有了很大的拓展，你看我已經用JS，配合DOM，寫出來一些很實際的功能，完成了一個前端專案。

7.這時候我的選擇比較多，我可以：繼續用原生JS完成一兩個類似的項目，比如註冊登陸，動態圖片展示等等；也可以：嘗試改進當前項目的程序設計，做一些程式碼的改進，這時候可以去看看JS模式這樣的書，因為第一個專案的程式碼結構通常沒有特別的程式設計，卻章法，這樣的書能告訴你更好的JS程式可以如何；我還可以乘勢把手上的項目重構成基於jQuery的程式碼，這樣就在對比中學會了jQuery的基礎，理解了jQuery的好處；我甚至可以把當前項目代碼重構成ES6語法，這樣就能在對比中ES6語法的好處。

8.接下來我就會去寫更複雜的項目，例如TODOLIST，自己從頭到尾實現一個這樣的應用，同樣以原生JS（ES5）寫第一個版本，然後選擇是否重構到jQuery或ES6，如果有興趣，甚至是TypeScript。繼續看JS程式設計方面的書，注意力應該是在程式“設計”，而不是語法細節，大多數時候語法的問題都是可以搜尋到的。程式「設計」是分析應用的需求，什麼功能，是否需要分模組，模組好不好分，不好分怎麼漸進地找出架構的方案，什麼樣的模組化是比較自然的，如何處理錯誤，是否需要模板支持，複雜的用例是自己實現還是找第三方的庫來集成，等等這些和實際開發零距離的問題。

9.這個專案我還是會放進github，寫完以後我就找一個老師（免費付費都沒關係），review一下我的實現，讓他指出我理解錯誤的地方，這是寶貴的學習機會。和第一個專案一樣，我還是會根據老師的回饋和自己的思考，決定是否繼續迭代，以及如何繼續進步。到這個時候，我也許會把市面上所有的Javascript的必讀書都買來看，看第一書很慢，第二本書不快，但看到第四五本書的時候，就可以很快了，挑選其中自己不了解的章節專門閱讀，然後把書裡提到的知識，技巧，實踐用到之前寫過的項目中去。

10我現在已經有了JS（ES5）比較全面的基礎，也比較熟練了，至少碰到問題我大概知道方向是什麼。我也接觸了jQuery，甚至可能已經比較熟悉；ES6也是。我對語言的基本生態有了比較全面而深刻的映像。現在我想來學一個框架，我會去做一點功課，看看自己喜歡哪個框架，選定了以後，我就先做完官方的tutorial，同時清楚一些基本的概念問題。

11.然後我做的，就是把之前的專案（如TODOLIST），用框架重新寫一遍，這時候我不會再有覺得很深澀的地方了，因為我有了JS的基礎，已經有了一些自己找答案，debug的經驗，即使框架本身有不清楚的地方，我都能自己透過搜索，或者研究，把答案找出來。就算找不出來，也至少有了基本的開發思維，雖然不知道答案，但也有大概的方向，如果我要問別人問題，也能問出更有回答價值的問題來，我已經走上了專業開發的路，不是因為我知道框架的這和那，而是我有了做開發的基本習慣和素養。

12.也許這時候我找到了第一份前端的工作，一段時間以後我發現自己對node後台開發和electron產生了興趣，我閱讀了基本的文檔以後，發現其實並不需要怎麼學習就可以用這些東西了。因為JS程式的架構，常見結構，模式，主要概念，我已經熟稔於胸，所以只要是在JS這個生態內，不管新出了什麼技術，無論是庫，框架還是模式，我都能在第一時間找到理解他們的路徑，我已經學會了怎麼學習，那些東西在JS程式裡是重要的，概念是如何組合的，變遷的，所以對我來說，學JS和用JS已經沒有什麼區別了。

13.然後呢，通常真正循序漸進學過來，語言基礎紮實的，到這時候已經不需要人來教了。

我認為有一些觀念和操作是和循序漸進相悖的。

1.過早追求「系統」學習，好高騖遠，眼高很容易手低，人的精力是有限的，要尊重學習規律，承認自己是普通人，告誡自己不要取巧，不要貪婪，慢慢來

2.覺得讀源碼是最「本質」的學習，結果是掉進細節的深坑不能自拔

3.過早埋頭進「最新」技術，例如框架，在沒有良好的語言基礎之前學，事倍功半，」最新「技術和核心技術很多時候不是一回事，有了基礎和核心，學新技術才是最有效率的，反過來卻不成立

4.把程式設計學習等同於看書累積“知識”，但程式設計最終是一種技能，不動手什麼也學不會，“知道”什麼和“會”什麼是兩回事

5.具體的東西不學，卻一開始就試圖找到「最佳」學習路徑，可能是最大的浪費了，有意義的目標是告訴自己明天幹什麼，而不是假設自己明天「應該」學會什麼

6.過度堆砌學習資料，以為找到的資料越多，羅列越完整，自己學得越快越好，事實恰恰相反，越是羅列，噪音越大，心理壓力和挫敗感越強，越容易放棄，在一個階段，一本書，配合少量網絡資料足夠了，」收藏「是一個不怎麼好的習慣，學習的人應該追求知識的消化，而不是堆砌

#

以上是JavaScript高效學習之路總結篇的詳細內容。更多資訊請關注PHP中文網其他相關文章！