本人從事JavaWeb開發(fā)，應(yīng)別人要求，思考再三恩沛，終決定專門開一貼來總結(jié)一下我個人目前推薦的學(xué)習(xí)路線在扰。從啥也不會到能夠從事JavaWeb開發(fā)，究竟要學(xué)習(xí)哪些東西雷客？很多人都會迷茫這個地方芒珠。所以我打算隨便談?wù)勎业目捶ā?/p>
我之前一直不想寫，因為我知道一旦寫了就要承擔(dān)壓力搅裙。必然會有一大波人來指責(zé)我皱卓，說什么什么你這樣講是毒雞湯，怎能不管算法部逮，不管計算機(jī)原理娜汁！你這樣是誤導(dǎo)新人！然后舉出一大堆例子甥啄，說基礎(chǔ)怎么怎么重要存炮，你這樣速成將來會有大問題！你這是在瞎扯蜈漓，一看就知道你不懂得Java的精髓！
我大概能預(yù)見這些情況宫盔，但我無所謂融虽，因為我所說的，不代表就是正確的灼芭，錯了又如何呢有额？我畢竟只是普通人。
我只能說彼绷，到目前為止巍佑，我所看到的情況即是如此。也許的確是我目光短淺吧寄悯，沒有達(dá)到網(wǎng)上大神說的那種境界萤衰。很多人給我的感覺就是，敲一個HelloWorld猜旬，都需要把計算機(jī)的二進(jìn)制編碼脆栋，以及計算機(jī)怎么誕生的這些完全搞明白才可以。否則我就不配敲HelloWorld洒擦，因為我不懂得原理椿争。
所以，這些東西我一直不想寫熟嫩，反正總歸會被罵秦踪，還不如清閑點(diǎn)算了。
可是隨著群里問我這個問題的人越來越多，而且這個事情也不是我隨隨便便就能講清楚的椅邓。最終舍扰，思量再三，我還是決定專門寫幾篇文章希坚，就我個人的看法來簡單說說边苹，從啥也不會到能夠從事JavaWeb開發(fā)的一個最直接的學(xué)習(xí)路線。
因為現(xiàn)在大部分公司還是沒有明確的前后端之分裁僧，比如我經(jīng)歷的幾個公司都是如此个束，前后臺都是一個人包了。稍微小一點(diǎn)的項目聊疲，一個人抖擻抖擻精神茬底，也就直接扛下來了。
所以获洲，在我的推薦路線中阱表，前端肯定也是要包括的。如果你只學(xué)Java贡珊，在目前的大趨勢中最爬，還是比較懸的。除非你找到那種前后端完全分開的公司门岔。
那么爱致，開始吧。
1.第一階段 - JavaScript
為什么我推薦先從JavaScript學(xué)起來寒随，原因有兩個糠悯。其一，JavaScript不需要你搭建什么環(huán)境妻往，比如Java你就得先安裝JVM互艾，配置環(huán)境變量⊙镀可能對已經(jīng)工作的你而言纫普，這真的沒什么，因為太簡單了判帮【粥遥可是，對于一個完全沒有編程經(jīng)驗的人而言晦墙，往往就會被卡死在第一步悦昵。連環(huán)境都不會搭建，后續(xù)的學(xué)習(xí)也就無從談起了晌畅。JavaScript就完全沒有這一顧慮但指，你隨便網(wǎng)上下載一個IDE（比如Sublime，HBuilder，Editplus）棋凳，就可以開始寫代碼了拦坠。然后，你的電腦上總該有瀏覽器吧剩岳，那么贞滨，你寫的代碼就能立即看到效果。俗話說拍棕，興趣是最好的老師晓铆，當(dāng)你看到自己編寫的網(wǎng)頁栩栩如生地展現(xiàn)在你的眼前的時候，那種喜悅的感覺會給你帶來繼續(xù)學(xué)下去的勇氣绰播。
第二個原因骄噪，JavaScript是一門比較優(yōu)秀的語言，一般來說蠢箩，其他面向?qū)ο蟮恼Z言特點(diǎn)链蕊，它也有。要談算法谬泌，JavaScript也能夠鍛煉你的算法水平滔韵。有興趣的可以去學(xué)習(xí)一下canvas，也就是畫布呵萨，自己嘗試著做一些特效奏属，里面會大量用到三角函數(shù)，物理上的摩擦力潮峦，以及數(shù)學(xué)的幾何模型等等。
很多東西勇婴，都可以用JavaScript模擬出來忱嘹。
總的來說，從JavaScript入手耕渴，免去了環(huán)境搭建的麻煩拘悦，你還能從中獲得很多學(xué)習(xí)的樂趣，你一定想不到橱脸，當(dāng)我第一次封裝了一個原生態(tài)的彈窗組件础米，和Grid組件的時候，我興奮得一晚上睡不著覺吧添诉。
當(dāng)我第一次用純粹的JavaScript做出輪播圖屁桑，雪花飄落，瀑布流栏赴，等等的特效蘑斧，我看著自己的作品，一種無與倫比的喜悅充斥著我的內(nèi)心。
正是JavaScript竖瘾，給了我學(xué)習(xí)編程的樂趣沟突！
可以說，當(dāng)你真正精通了JavaScript這門語言捕传，也就學(xué)會了一切的編程語言（面向過程的除外）惠拭。因為都差不多的，比如我后來重新學(xué)習(xí)Java庸论，每看到一個地方职辅，腦子里立馬就聯(lián)想到：“咦，這和JavaScript中的XXX不是一個意思嗎葡公？”
記得清華大學(xué)的華成英教授曾經(jīng)說過罐农，最好的學(xué)習(xí)方法就是類比。就是說催什，當(dāng)你遇到一個陌生的技術(shù)涵亏，如果能將它和你已經(jīng)熟悉的東西類比起來，比較他們的異同點(diǎn)蒲凶，那么气筋，你學(xué)習(xí)的效率會像坐火箭一樣蹭蹭蹭上漲！
好了旋圆，說了這么多宠默，現(xiàn)在我給出我推薦的學(xué)習(xí)列表：
預(yù)備知識：
1.html + css （了解一下基本的標(biāo)簽即可，最起碼要知道div灵巧，類選擇器是什么搀矫，怎么引入css文件？還有那些常用的css屬性刻肄，background瓤球，width,height等等）
推薦方法：這個階段，有一個很好的辦法能迅速培養(yǎng)起來自己在該方面的編程意識敏弃，就是你隨便找一個生活中的東西卦羡，比如桌子，然后麦到，強(qiáng)迫自己在一天之內(nèi)想出它的50個屬性绿饵。
比如，一張桌子瓶颠，什么顏色拟赊、材質(zhì)是啥、高度多少步清、寬度多少要门？等等虏肾。
50個屬性有點(diǎn)夸張，但是你一定要去努力嘗試欢搜，想出來多少是多少封豪？就算想不出50個也無所謂，有多少算多少炒瘟。然后吹埠，把這些屬性用筆記下來。好好思考一下疮装，這樣做的目的是什么缘琅。
當(dāng)你真的去這么做以后，你就會發(fā)現(xiàn)廓推，哦刷袍，原來css就是在做這個事情。
再提示一下樊展，這張桌子在房間的什么位置呻纹？它的旁邊是什么？等等专缠，這些都可以算作它的屬性雷酪。
話不多少，自己體會一下就行了涝婉。
這個階段哥力，可以網(wǎng)上找點(diǎn)基礎(chǔ)的視頻來看看，不需要掌握太多墩弯，因為css往深了研究還是相當(dāng)復(fù)雜的吩跋。我相信，誰也不敢拍著胸脯說自己完全精通css的渔工，大部分人還是處于能夠運(yùn)用的階段钞澳。我也只是略懂。初學(xué)者不建議去看那些特別深奧的內(nèi)容涨缚，大概了解一下即可。
至于什么css3策治，響應(yīng)式脓魏，bootstrap，暫時沒必要去學(xué)通惫。
時間：3天
畢業(yè)標(biāo)準(zhǔn)：能夠用 html + css 做一個網(wǎng)站的登錄界面茂翔。
1.JavaScript基本語法
這個階段，主要去看下JavaScript的概念履腋，基礎(chǔ)數(shù)據(jù)類型珊燎，for循環(huán)惭嚣。（while循環(huán)我都不推薦去看，用得很少悔政，工作中基本都是for循環(huán)）
注：這個階段盡量去網(wǎng)上看視頻晚吞，不要去各種百度。經(jīng)常你會發(fā)現(xiàn)谋国，你明明把代碼原封不動得抄過來了槽地，可為什么就是沒效果呢？怎么就是和網(wǎng)上說的不一樣呢芦瘾？
不管你看的是什么代碼捌蚊，基本上就是兩種可能。第一種近弟，代碼本身的問題缅糟。比如別人隨便在自己項目里復(fù)制了一段代碼，放到網(wǎng)上祷愉，然后說明這個代碼是用于解決XX問題的窗宦。
這個時候，你根本就沒有對方項目的環(huán)境谣辞，代碼當(dāng)然用不了啦迫摔！
另一種可能，就是代碼沒問題泥从，但是有些地方要修改一下句占，可是你還不會用瀏覽器的調(diào)試工具來調(diào)試，所以效果出不來躯嫉。
不管怎么樣纱烘，你這樣?xùn)|找找西找找，除了在浪費(fèi)時間祈餐，根本就達(dá)不到學(xué)習(xí)的目的擂啥。因為根本就不系統(tǒng)啊帆阳！為什么現(xiàn)在培訓(xùn)機(jī)構(gòu)這么多哺壶，就是因為很多人都不知道怎么去系統(tǒng)學(xué)習(xí)，就算想要自學(xué)蜒谤，也不知道從何入手山宾。尤其是初學(xué)者，根本不知道怎么回事鳍徽，可能就是腦袋一熱资锰，勞資要轉(zhuǎn)行了，于是就網(wǎng)上到處亂學(xué)阶祭。
這個階段绷杜，你要買書也可以直秆，但是前提你要有那個耐心看下去。其實我是不推薦買書的鞭盟，因為現(xiàn)在這個階段的你能力還不夠圾结，而且，咱大天朝出的技術(shù)書籍你也懂的懊缺，都不知道哪里拼湊來的疫稿。
當(dāng)然，不排除好書鹃两，可是畢竟太少了遗座。
即便是我，有的時候翻翻當(dāng)年憑著一腔熱血買來的Java書籍俊扳，偶爾都要皺一下眉頭途蒋，心想，這個作者到底想表達(dá)什么馋记？這些案例到底想要說明什么号坡？
什么時候該買書，我覺得是你已經(jīng)可以從事開發(fā)了梯醒，而且對編程有了一些自己的心得宽堆，覺得自己在某方面需要再提高一下，那么茸习，這個時候你可以去買書畜隶，因為，這個階段号胚，你買的書籽慢，基本上自己都可以看懂了。
新手買書猫胁，真的會無語的箱亿，除了讓你懷疑人生之外，并沒有太大的益處弃秆。
看視頻届惋，敲代碼！
看視頻菠赚，敲代碼盼樟！
看視頻，敲代碼锈至！
重要的事情說三遍，這個階段還是比較重要的译秦。對于一個完全不懂編程的人來說峡捡，可能寫一個一層for循環(huán)击碗，就要花去10分鐘的時間，然后對著代碼看來看去们拙，看來看去稍途，反復(fù)推敲。這是好現(xiàn)象砚婆，這說明你正在開始慢慢培養(yǎng)自己的編程思維械拍。不要著急，要循序漸進(jìn)装盯。
這個階段坷虑，主要是學(xué)習(xí)JavaScript的語法，看視頻埂奈，一遍看不懂看兩遍迄损，直到你看懂了位為止。
重點(diǎn)：
for循環(huán)账磺、if語句芹敌。
數(shù)組，字符串垮抗，function（包括傳參和return）氏捞，閉包的含義，JavaScript內(nèi)置函數(shù)冒版。
數(shù)組的常用方法液茎，push，slice啥的盡量都要會壤玫，如果不會的話豁护，就照著例子寫，多寫幾遍就會了欲间。
時間：3天楚里。
畢業(yè)標(biāo)準(zhǔn)：能夠自己寫一個function，知道function是什么意思猎贴，會用alert班缎，conole.log調(diào)試程序，最好能直接通過瀏覽器的F12查看控制臺她渴，在里面練習(xí)和調(diào)試达址。數(shù)組要多看看，了解數(shù)組的增刪改查怎么用的趁耗，條件允許的話沉唠，你可以通過數(shù)組來模擬一下Java中的ArrayList。
2.JSON
在JavaScript中苛败，我感覺json是重中之重满葛！
一般來說径簿，js創(chuàng)建對象有兩種方式，一種是通過構(gòu)造函數(shù)嘀韧，也就是function的方式篇亭，另一種就是直接創(chuàng)建一個json。
這個階段一定要好好理解一下json的概念锄贷，然后用json去做一些事情译蒂。比如，你寫一個注冊頁面谊却，里面有用戶名柔昼，密碼，年齡因惭，郵箱等等的input框岳锁。你可以嘗試一下，用json的方式蹦魔，把這些數(shù)據(jù)裝起來激率。
體會一下這樣有什么好處？
最好能夠體會到勿决，json的作用乒躺，其實就是為了中轉(zhuǎn)數(shù)據(jù)的。那么多數(shù)據(jù)低缩，怎么才能夠以一種較好的方式裝起來呢嘉冒？
你用數(shù)組自然可以，但是不夠語義化咆繁，用json的話就恰到好處讳推。它這個主要是用于描述一個對象的，而數(shù)組更多用來充當(dāng)一個容器玩般。
時間：1 ~ 2 天
畢業(yè)標(biāo)準(zhǔn)：能夠熟練使用json來裝載數(shù)據(jù)银觅。自己想一個恰當(dāng)?shù)谋扔鳎瑏硇稳菀幌耲son像什么東西坏为？最好自己想究驴，通過這個比喻來更加牢固得記憶 JSON 以及它的用法。別人舉得例子再好匀伏，也比不上你自己的例子洒忧。
3.dom
所謂的dom，簡單來說就是通過JavaScript來獲取頁面上的一些元素够颠。比如你寫一個div熙侍，它的id叫做box，那么就可以通過document.getElementById('box')的方式獲取這個dom元素。
接下來核行，你可以給他添加樣式牢硅，設(shè)置點(diǎn)擊事件等等。
具體的話芝雪，隨便網(wǎng)上找點(diǎn)資料或者視頻來看就行了。這一塊相對來說還是比較簡單的综苔。
注意：dom和css不是一回事惩系，css是樣式表，而dom是你用JavaScript取到的類似于div一樣的東西如筛，你可以用JavaScript代碼去操作頁面上的div元素堡牡。比如給他加一個樣式。
那些css屬性杨刨，不需要去背晤柄，只需要記住常用的就好了。用多了你自然會妖胀。
重點(diǎn)：
document.getElementById
document.getElementsByTagName
innerHTML芥颈，appendChild，
赚抡。爬坑。。
這個階段涂臣，你一定要把瀏覽器的F12用得出神入化盾计，反復(fù)使用，反復(fù)練習(xí)赁遗。
時間：2天
4.事件
了解一下基本的JavaScript事件模型署辉，明白事件冒泡是怎么回事，什么時候要阻止冒泡。（事件捕獲幾乎用不到，不要去學(xué)了）還有马绝，onclick和addEventListener的區(qū)別的是什么祭埂？我能不能自己封裝一個通用的綁定事件函數(shù)？
時間：1天
畢業(yè)標(biāo)準(zhǔn)：能夠模擬jQuery的on函數(shù)果录，封裝一個自己的方法，達(dá)到和jQuery一樣的效果，最好能兼容所有瀏覽器侠姑。
5.jQuery
學(xué)完上面的這些內(nèi)容，不要猶豫箩做，不要慌張莽红，立馬鉆入jQuery的學(xué)習(xí)中。這段時間，可以開始自己寫一點(diǎn)小東西了安吁。當(dāng)然醉蚁，要是心里沒底的話， 還是以看視頻為主鬼店，最起碼网棍，把jQuery的常用方法都過一遍。過一遍就行了妇智，不要去多看滥玷。
然后，第二步巍棱，學(xué)習(xí)常用的jQuery方法惑畴，并且自己可以開始嘗試著寫寫看，如何用純粹的JavaScript來達(dá)到相同的效果航徙。一些簡單的方法如贷，比如jQuery的css，height到踏，width杠袱，addClass，removeClass夭禽，這些方法霞掺，你完全可以自己用js來模擬一下。
在今后的工作中讹躯，你開發(fā)前端頁面的絕大多數(shù)時間菩彬，就是和jQuery打交道。所以潮梯，這一塊必須要好好掌握一下骗灶。這個時候，可以去買書秉馏，也可以不買耙旦。但是最好有個自己的知識庫，把常用的方法萝究，和一些你覺得畫得比較好的頁面免都，特效等等，都保存下來帆竹。
或者绕娘，你也完全可以去網(wǎng)上寫一寫自己的博客，博客園栽连，簡書险领，csdn啥的侨舆，都可以。通過寫博客绢陌，一來可以自己總結(jié)挨下，二來也能幫助別人。
6.案例
這個階段脐湾，正常情況下臭笆，js水平應(yīng)該已經(jīng)達(dá)到一定層次了。在接下來的日子秤掌，可以考慮來買一點(diǎn)書來看耗啦，當(dāng)然，千萬不要從第一頁看到最后一頁机杜。有選擇性的去看，并且衅谷，一定要帶著批判的精神去看書椒拗，親自去驗證一下書中所說。為什么到這個時候获黔，我才推薦去買書來看呢蚀苛？很簡單，因為到了這個階段玷氏，你才能看得懂堵未。如果是一個完全不懂編程的新人，直接去買書盏触，看懂的概率很小渗蟹，除非你真的是天縱奇才，具有極高的天賦赞辩。
盡量去買外文翻譯過來的書雌芽，國產(chǎn)的書籍不太建議購買（當(dāng)然，如果你是英語大牛的話辨嗽，直接看原版世落，最好！）糟需。至于為什么屉佳，大家都懂的。
我也看過很多很多的書洲押，最后發(fā)現(xiàn)武花，國內(nèi)的很多書，大都本著一種哪怕你再聰明诅诱，我也要把你說糊涂了的宗旨髓堪。這也是你為什么往往看書看不進(jìn)去的原因。
而國外的書，美國的就挺好干旁，不過我感覺寫的最認(rèn)真的還是日本的技術(shù)書籍驶沼。看起來感覺就不一樣争群，寫的通俗易懂不說回怜，而且我甚至能看到作者為了出這本書，真的是耗費(fèi)了巨大的精力换薄！這是事實玉雾。頗有種哪怕你再笨，我也要把你教會的感覺轻要。
我并不哈日复旬，但說句實在話，人家寫的書真的是一種奉獻(xiàn)精神冲泥、值得敬佩驹碍。而不像我們國內(nèi)的技術(shù)書籍，一大抄凡恍，真正能看看的好書不多志秃。
這個階段，一邊看書嚼酝，一邊自己動手敲代碼浮还，寫案例。比如說闽巩，你看到一個網(wǎng)站钧舌，覺得他的布局都挺好看的，你就可以思考下又官，我能不能來仿一個呢延刘？
好了，前臺頁面有了六敬，開始思考碘赖，這些數(shù)據(jù)哪來的？
肯定不可能頁面里面全部寫死吧外构，想想也不可能普泡。那么毫無疑問，肯定是后臺傳過來的审编。
接下來撼班，就開始思考怎么傳過來的呢？于是乎垒酬，ajax技術(shù)又來了砰嘁，馬上再去學(xué)習(xí)ajax件炉，帶著疑問去學(xué)。
后臺語言矮湘，比如說Java斟冕，自然而然的，會驅(qū)動你去學(xué)習(xí)缅阳。
以上的這些路線磕蛇，只作為一個參考。當(dāng)然十办，這些都還只是JavaScript學(xué)習(xí)的初步階段秀撇，但是學(xué)習(xí)這個事情，本來就需要在工作中慢慢體會向族，自己主動去學(xué)的呵燕。難以通過一篇文章就說得清。最后件相，希望本文對諸位有所幫助虏等，謝謝。
