js給初學(xué)者的印象總是那麼(me)的“雜而亂”，相信很多初學(xué)者都(dōu)在找輕松學(xué)習js的途徑。我試著(zhe)總結自己學(xué)習多年js的經(jīng)驗，希望能(néng)給後(hòu)來的學(xué)習者探索出一條“輕松學(xué)習js之路”。js給人那種(zhǒng)感覺的原因多半是因爲它如下的特點：

A：本身知識很抽象、晦澀難懂，如：閉包、内置對(duì)象、DOM。

B：本身内容很多，如函數庫、對(duì)象庫就(jiù)一大堆。

C：混合多種(zhǒng)編程思想。它裡(lǐ)面(miàn)不但牽涉面(miàn)向(xiàng)過(guò)程編程思想，又有面(miàn)向(xiàng)對(duì)象編程思想，同時(shí)，它的面(miàn)向(xiàng)對(duì)象還(hái)和别的編程語言（如：C++，JAVA，PHP）不大一樣(yàng)。就(jiù)好(hǎo)像又是新的一樣(yàng)，讓你對(duì)曾經(jīng)學(xué)的面(miàn)向(xiàng)對(duì)象産生了懷疑......

D：辛苦學(xué)習後(hòu)又看似和實際應用脫節。通常學(xué)了很久的js基礎之後(hòu)，變量、函數、對(duì)象你也都(dōu)略知一二，但一到公司開(kāi)發(fā)項目的時(shí)候，卻又難以下手。因爲公司在開(kāi)發(fā)實際項目的時(shí)候通常都(dōu)是直接用它的衍生庫，如：jquery，angular，boostrap，amaze，layui，ueditor等，而這(zhè)些庫又多如牛毛，同時(shí)還(hái)有自己的難點。讓你都(dōu)不知道(dào)該學(xué)哪個好(hǎo)，甚至都(dōu)懷疑自己學(xué)的是不是js了，好(hǎo)像有多個版本的js一樣(yàng)，總是學(xué)不完......

那麼(me)，怎麼(me)才能(néng)在js領域内學(xué)的輕松甚至遊刃有餘呢？我總結了一些實戰意義的js學(xué)習經(jīng)驗：

首先要緊緊抓住它的地位

時(shí)刻都(dōu)不能(néng)忘記，否則很容易犯“一葉障目不見泰山”的錯誤。不要學(xué)了很久就(jiù)知道(dào)js是編程語言，就(jiù)是寫代碼，而且特點就(jiù)是亂七八糟就(jiù)完了，那樣(yàng)是學(xué)不好(hǎo)js的。要時(shí)時(shí)抓住它的地位，确切的說(shuō)是它在整個Web中的地位：它屬于前端的核心，主要用來操控和重新調整DOM，通過(guò)修改DOM結構，從而來達到修改頁面(miàn)效果的目的。要用這(zhè)個中心思想去指導後(hòu)續的一切js的學(xué)習，并且形成(chéng)條件反射。

要有一條清晰的學(xué)習路線

      這(zhè)個隻能(néng)是過(guò)來人給你提供參考了。我的學(xué)習路線如下：

A：js基礎部分，如：定義變量、函數、數組、字符串等的處理，内置函數、内置對(duì)象等；

B：js面(miàn)向(xiàng)過(guò)程編程思想，封裝出各個函數，試著(zhe)用這(zhè)些去做一些常見的小功能(néng)，如：選項卡、自定義多選按鈕、自定義播放器、3D幻燈片；

C：js面(miàn)向(xiàng)對(duì)象編程思想，試著(zhe)去封裝一些你自己的對(duì)象，提供出有意義的接口出來；

D：學(xué)了上述的内容，然後(hòu)學(xué)常用的庫，這(zhè)裡(lǐ)必須學(xué)jquery；

E：學(xué)基于jquery之上的常見插件，如：bootstrap，Layer，富文本編輯器等；

F：綜合應用上面(miàn)的多種(zhǒng)庫寫實際項目的模闆，多寫幾套。

注意學(xué)習方法

        我的學(xué)習方法總結如下：

       A：多買幾本國(guó)外的js書籍，不要購買那種(zhǒng)20天精通之類的書。否則你是很難學(xué)通的，更可怕的是：本來你買本好(hǎo)書自學(xué)3個月可能(néng)學(xué)會(huì)的，它們硬是能(néng)折騰你兩(liǎng)年......

書籍推薦（僅供參考）

《JavaScript DOM編程藝術》

《JavaScript權威指南》

《javaScript DOM高級程序設計》

《JavaScript設計模式》

《鋒利的jquery》

争取把書上的功能(néng)都(dōu)自己練習多次，不是一次。書讀百遍，其義自見。

B：從多角度去學(xué)習和領悟

      充分調動你所學(xué)的東西，從多角度去做某一功能(néng)，如：以前你是從面(miàn)向(xiàng)過(guò)程角度做的，現在改爲從面(miàn)向(xiàng)對(duì)象的角度再來做，或者繼續做成(chéng)可以直接使用的插件，提供屬性、方法等出來。争取讓你做的這(zhè)個功能(néng)逐漸能(néng)使用到實際項目中來。這(zhè)樣(yàng)的好(hǎo)處：既綜合應用了你的所學(xué)，又能(néng)有實際意義。

C：一定不要好(hǎo)高骛遠

      不要放過(guò)哪怕很小的動手機會(huì)，如做一個選項卡。千萬不要認爲有了類似的甚至更好(hǎo)的插件就(jiù)不需要自己寫了，知識是别人的，不是你的，你即使會(huì)用了也對(duì)你的技術技能(néng)水平沒(méi)有任何提升。你要多問自己，如果要我來做，我該怎麼(me)做？

D：腳踏實地的同時(shí)，也不要脫離實際

      多看現在網上已經(jīng)出現的效果好(hǎo)的功能(néng)，讓它去激發(fā)你的學(xué)習熱情，盡量去學(xué)著(zhe)模拟，調動你的知識去和實際相結合。

E：多寫總結

      這(zhè)種(zhǒng)總結不但包括源代碼、顯示效果截圖，還(hái)應該很容易犯的錯誤和對(duì)應的解決方法以及最後(hòu)一兩(liǎng)句精簡的結論性語句。對(duì)自己寫的總結不是寫完了就(jiù)了事(shì)了，要多回顧、多改進(jìn)、多精簡。到做項目的時(shí)候，應該是看裡(lǐ)面(miàn)的一兩(liǎng)句話就(jiù)知道(dào)是講什麼(me)了，而不要再去看長(cháng)篇大論了。

F：構建知識導圖

      這(zhè)個可以讓你越學(xué)越清晰，比如：http://www.phpkhbd.com/sky.html，你可以按你喜歡的任何形式去做，隻要自己印象深刻就(jiù)行。

注意：知識導圖也應該是經(jīng)常修改、修正，讓它更合理、更清晰。

注意事(shì)項

A：充分利用一切手段

      很多人總感覺時(shí)間緊，沒(méi)有大塊的時(shí)間學(xué)習。我要說(shuō)你不會(huì)學(xué)了，你不應該隻是抱怨，而是要利用一切手段去學(xué)習，要知道(dào)，不一定隻有看書才叫(jiào)學(xué)習。當你冷靜的坐在某個地方，思考了一下，總結了一下，你也都(dōu)叫(jiào)學(xué)習，但凡有靈感，就(jiù)可以記錄下來，比如：記錄在手機上，等方便了再記錄在專門的地方。這(zhè)都(dōu)叫(jiào)學(xué)習。

B：貴在堅持

      要沉的下心。沒(méi)有一蹴而就(jiù)的成(chéng)功，否則那也不是成(chéng)功，隻能(néng)叫(jiào)“僥幸”。不但要老老實實的把每個功能(néng)都(dōu)試著(zhe)去實現，而且要精益求精地不斷去修正，這(zhè)個過(guò)程是漫長(cháng)的，也是考驗一個人是否是人才的标準。

C：注意培養信心

      此時(shí)的你，不适合一來就(jiù)看很複雜很炫的網頁效果的源代碼，也不适合一來就(jiù)學(xué)jquery，angular，vue，bootstrap這(zhè)些東西。這(zhè)些内容包含了很多深奧的知識在裡(lǐ)面(miàn)，在沒(méi)有任何基礎的情況下直接學(xué)這(zhè)些，會(huì)嚴重打擊你的自信心。而此時(shí)你是弱小的，你需要的是培養信心，而不是反過(guò)來，否則結局很可能(néng)是“夭折”，離學(xué)有所成(chéng)也就(jiù)遙遙無期了。

D：多跟學(xué)的好(hǎo)的過(guò)來人學(xué)習

站在巨人的肩上，才能(néng)看的更遠。

E：不要浪費在工具的不停選擇上

    js的編輯工具很多，如果無從下手，建議使用：sublime，或者使用Hbuilder。很多公司裡(lǐ)的技術人員都(dōu)用這(zhè)些，你直接用這(zhè)個也減少了和别人之間的溝通問題。我也是用這(zhè)個，感覺很好(hǎo)。

總結

感覺js學(xué)起(qǐ)來“雜而亂”的原因是因爲你太“聰明”了，一開(kāi)始就(jiù)管的太寬，利害得失也計算的太精細。要求太完美則心裡(lǐ)承受能(néng)力下降，很容易出現“障”。此時(shí)，你應該“笨”一些，不要考慮那麼(me)長(cháng)遠，“傻人有傻福”，隻要做好(hǎo)今天就(jiù)夠了。一些不合理的學(xué)習方法和心态也讓你迷失了自我，如：心浮氣躁、眼高手低、好(hǎo)高骛遠，這(zhè)些都(dōu)會(huì)讓你在“亂七八糟”的js面(miàn)前深陷迷霧、不能(néng)自拔。此時(shí)，你應該重新定位自己的位置，重新去認識js，放下包袱，方能(néng)輕松上陣。把杯子先倒空，才能(néng)灌新水......其實，js是前端的核心。影響越來越深的互聯網+會(huì)渴求越來越多的js人才，隻有經(jīng)曆過(guò)真正刻骨銘心的學(xué)習經(jīng)曆，才能(néng)造就(jiù)出赢得未來的真正精英。