首頁 > web前端 > js教程 > 主體

JavaScript高效學習之路總結篇

巴扎黑
發布: 2017-08-04 13:31:09
原創
1431 人瀏覽過

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中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板