學習新的東西是件可怕的事。對我來說,掌握一項新技能最大的問題是,我不知道自己懂什麼。鑒於此,定個計劃,學習你感興趣的東西應該會有用。這篇文章的主旨就是:你為學習JavaScript 制定的藍圖、路線、行動計劃!你不必擔心找不到最好的資源,先整理些不好的資源,再確定下一步該學什麼。遵循它,一步一步來。
任務0:了解什麼是JavaScript
在你真正開始學習JavaScript 之前,花一分鐘了解一下什麼是JavaScript,它有哪些功能。 JavaScript不是jQuery、Flash或Java。與它們不同,它是一種獨立的編程語言。 JavaScript 是浏覽器語言(盡管現在不完全是)。主要目的是給靜態頁面增加交互性。在浏覽器裡,它不會為你更換PHP或Ruby,也不會更改你的HTML或CSS;你可以把它們串在一起使用。另外,它沒有你想的那麼難學。 補充說明:你應該聽過jQuery,它可能是被使用最廣泛的JavaScript 庫。也許你還聽說過其他比較流行的JavaScript 框架,比如Mootools,,YUI,Dojo 等等。可以將它們統一看做JavaScript輔助工具集;當你使用它們的時候,你還在寫JavaScript,但都是些很抽象的JavaScript。它會讓你事半功倍。 “你甚至可能聽到有人說,你應該先學jQuery(或其他庫)再學JavaScript。我很尊重他們但完全不同意這種說法。先把JavaScript 學好再用其他庫,你會發現你會做的更好;結果就是,你會編寫更好的JavaScript。”
任務1:通過Codecademy.com站點的課程來學習
Codecademy是一個相對較新的網站,其廣告語是“最易學的編碼方法”。目前,該網站僅有兩個課程,“初級編程”和“JavaScript快速入門指南”。沉浸在JavaScript 中是種不錯的體驗。跟 Try Ruby 練習非常相似,你會學到簡短的課程、在浏覽器裡編碼,然後看結果。得到全部分數、打開成就徽章。(Ruby,一種為簡單快捷的面向對象編程(面向對象程序設計)而創的腳本語言。) 如果你已熟悉了另一種編程語言,你也許可以先學“JavaScript快速入門指南”;如果這是您第一次編程(HTML和CSS除外),你會發現“初級編程”課程相當有用。Codecademy是一家免費網站,但需要注冊。
任務2:appendTo 截屏方法
appendTo 視頻有一套特別適合初學者的截屏方法。 如果你想用正確(容易)的方法學習JavaScript,學習這些課程絕對管用。視覺訓練總是有效的! “用我們提供的點播內容、務實的訓練解決方案來提升自己的技能。無需注冊、無需綁定、絕不忽悠。”
任務3:閱讀一本好的關於JavaScript 的說明書
一旦你通過Codecademy上的課程來學習,你就會想搞到一本關於JavaScript的詳細說明書–介紹所有的類型、運算符、控件架構等等。 如果可以的話,我來介紹幾個好的說明書: 《再說JavaScript》 – 這本說明書可在Mozilla開發者網絡上找到,語言公正。這本書內容很豐富,有很多代碼實例和文段介紹。 《Eloquent JavaScript》 – 該書由Marijn Haverbeke 編寫,可免費在線閱讀,如果你想弄個硬拷貝可以上亞馬遜網站購買。它比MDN說明更詳細,因為它不僅涵蓋了JavaScript 語言,而且包括編碼風格以及在浏覽器裡使用JavaScript。當然,“eloquent”並非言過其實。(eloquent - 雄辯的、口若懸河的) 《Getting Good with JavaScript》 – 沒錯,這本書是我寫的,但是我介紹這本書是另有原因的。它跟我在前面介紹的兩本說明不同;在這本書裡我只介紹了編程人員快速掌握編程技巧所需要的部分。此外,它還附帶超過6個小時的截屏視頻,因此,想要就去看看吧。(當然,這本不是免費的。)
任務4:安裝、學習Firebug(或開發人員工具)
一旦你開始在浏覽器裡使用JavaScript,就需要安裝Firebug並熟悉它的性能。Firebug是一款用於Firefox的插件,它能幫你創建和調試網頁:對網頁開發者來說,它就像外科醫生的‘手術刀'。如果你不用Firefox?喜歡Safari 或者Chrome怎麼辦?沒問題:可以查找類似Firebug的內置開發人員工具。 “你可以在Mac地址欄裡按選項+命令+I 或者按快捷鍵Control + Shift + I ,來打開設計工具面板。” 通過打開你選的工具,只需在你喜歡的其中一個網站上點擊點擊,你就會學到很多東西。這裡有一些能加速你學習的資源:FirebugFirebug網站和維基百科Firebug的CSS-技巧說明你應該在Nettuts+上使用Firebug的10大理由。Firebug:從白帶到黑帶,Tuts+ Marketplace 網站(http://marketplace.tutsplus.com/item/firebug-white-to-black-belt/118795)設計工具設計工具網站Google I/O 2011:由Paul Irish重組的浏覽器設計工具Google 浏覽器設計工具:Paul Irish 的快速開發12技巧
任務5:讀一本有關JavaScript的書籍
現在你已經熟悉了些基礎知識,但是還有很多東西要學。盡管我推薦的一些書可能會讓你‘破產',但你會發現任何時候我都會推薦4本高質量的書:
前兩本是一般的、較深入的JavaScript 資源,它們會讓你從簡介到較深層次逐步理解;當然,簡介裡會有一些重疊的說明,但不多:剛好讓你看起來很舒服。(注:雖然這些書在亞馬遜網站能買到,我已經鏈接了出版商的網站,因此,你能看看范例章節。) 《JavaScript高級程序設計》- Nicolas C. Zakas 編寫,這本書涵蓋了它能涵蓋的所有內容。如果你以前看過Zakas的任何作品,你會發現他是個不折不扣的天才。除了涵蓋了JavaScript語言,這本書還能讓您在浏覽器裡很好的使用JavaScript。 《JavaScript 24-hour Trainer 》由Jeremy McPeak 編撰,該作者也寫過Nettuts+。它不僅僅是一本書:還附帶了一張長達四小時的教學光碟。全書共43節課,涉及編碼句法指導和代碼優化。 雖然這些書非常適合編程人員學習JavaScript語言以及如何在浏覽器中使用這些語言,但是學無止境。雖然這些書的確進入了一些模式和實練中,我再推薦兩本我認為有用的書。1)《JavaScript Patterns 》- Stoyan Stefanov著。我也是剛剛讀完這本書,我真希望能盡快讀完它。在讀過上面的資源之後,你可以學到如何編寫JavaScript,但是這本書會教你如何對資源進行重組,這項技能很重要,並非如你想象般簡單。2)《JavaScript:The Good Parts 》- Douglas Crockford 著。該書介紹了JavaScript的優缺點。
任務6:做些事情!
在學習完上述資源後,你應該已經嘗試了一些代碼樣本:修改代碼、整合代碼看看會怎麼樣。但是是時候讓自己休息一下,做點東西出來了。 你能做什麼呢?你能做很多東西。這裡有一些意見。1) 圖片庫:顯示一套圖片縮略圖和主圖。當用戶點擊縮略圖的時候,要用較大的縮略圖(不是原縮略圖)替代當前的主圖。如果你能覆蓋縮略圖alt 標記的標題就獎勵積分,或是在用戶一分鐘內未點擊的時候進行圖片循環。2) 待辦列表:聽起來有點難,我也不打算推薦你制作一個完整的待辦列表。只需要做一個文本框並在其旁放上按鈕;點擊按鈕的時候,已輸入的文字會在一個無序列表下面變成一個項目。點擊列表項目便可移除。這聽起來很容易,但有幾個陷阱,對初學者來說仔細想想還是很有好處的。3) 動畫框:動畫其實是小把戲而已,並不需要弄得太復雜。做一個包含了少許文本的div,其上要有若干按鈕。一個按鈕用來調整寬度,一個用來調整高度;還有一個用來調整背景顏色。關鍵是不要讓更改發生得太快,但在一秒鐘之內。記住,Google 是你的朋友,特別是如果迄今為止你還未用JavaScript做任何動畫的話。 我相信你能想到其他的很好的練習的計劃。當然,學習的唯一方法是把自己從安樂窩裡拽出來。“此外,在所有的技能水平上,確保JavaScript 類別在Nettuts+上有大量教程列表。”(Nettuts是一個專注於提供網絡開發教程的網站。)
任務7:開始學習如何使用JavaScript庫
如果你學到了這個地步,就會意識到有些JavaScript 編寫任務很難(或根本不能)通過跨浏覽器的方式實現。最可能違規的便是過量的DOM操作,AJAX和動畫。這也就是為什麼我們需要JavaScript 庫的原因。 正如我前面提到的,一個JavaScript 庫的詳細內容猶如減輕痛苦的蜜糖。因此,現在有必要來看一下。這裡有大量庫供你選擇,我會讓你自己決定從哪個開始。無論是jQuery 還是Mootools,YUI 還是Dojo,它們各自的網站會為你提供開始學習時你所需要的一切信息。如果你覺得用得著就來試試吧。 最流行的庫: 雖然很容易得到大量的庫,你還是應該選一個受歡迎的– 至少排名第一。 jQuery Dojo YUI MooTools Prototype
任務8:緊隨大師的步伐
有很多令人難以置信的JavaScript 天才,他們一直在做些很酷的東西,你一定不想錯過。值得慶幸的是,我們的工作狂Siddharth 副主編已經搞到一份33名設計人員列表,要想成為一名JavaScript 發燒友你就必須訂閱它。扔下手頭的工作,訂閱/跟隨這些設計人員。這是必須要做的。 但是,你還能做更多事情。這個公平網站經常發布關於JavaScript 的信息,所以不要走開。此外,關注JavaScript Show ,一檔全世界關於JavaScript最新最大的播客。你可能還想注冊JavaScript電子周刊簡訊。 還想要更多嗎?關注Tuts+Marketplace 的JavaScript 類。
最後undefined 感謝閱讀此文!真誠的希望它能幫你成為一名JavaScript 愛好者。如果你已對JavaScript 很熟悉,你可以在評論中推薦其他任何相關資源。
原文:http://article.yeeyan.org/view/188878/225166