Javascript 入門學習指導

來源:互聯網
上載者:User

標題寫得有點大, 其實只是給一位想學習 Javascript 的朋友推薦一些學習方法和入門技巧.

Javascript 是一門簡單易學, 門檻極低的語言. 編程入門我覺得從 Javascript 入手也非常合適. 只要有個文字編輯器, 不超過 30s 就可以寫一個 Hello World 程式.

下面是一個學習提綱, 一般不管有沒有編程經驗的人, 按提綱學習完了基本就可以算是入門了(其實任何一門程式設計語言的基礎學習內容都大同小異):

  1. 資料類型:
    Javascript 的資料類型算是比較簡單的, 入門學習我覺得就知道有數字, 字串, 布爾, 數組, Date, null 就夠了, 提高的時候隨便找本手冊通讀下資料類型部分也用不了多長時間就能掌握, 關鍵還是在實際應用中去理解.
  2. 運算式和運算子:
    簡單來說就是 a = b + c 這種形式的語句, 整體叫做運算式, 其中 = 和 + 是運算子, 入門階段會用"加減乘除與或非"再加上++, --, ==, != 就夠用了. 這部分內容也不多, 建議找本手冊通讀一遍.
  3. 語句:
    這部分較前面兩部分稍顯複雜, 但多做些實驗, 接觸多了自然就掌握了, 無非就是判斷, 迴圈, 定義變數, 函數一類, 寫任何程式都離不開這些東西, 因為實在太基礎了.
  4. 定義/調用函數:
    一個完整的項目就像一輛汽車, 前面提到的就像汽車的零件, 要把零件變成汽車, 還需要一個中間過程, 就是把零件先組裝成發動機, 傳動系等可以獨立啟動並執行系統, 每個系統中還可以包含更小的系統, 這就是函數. 
    函數簡單說就是一個個功能塊, 定義好功能塊, 然後裝配到項目中去應用, 有的功能塊像發動機, 只用到一次, 有些功能塊像車輪, 會用到多次.
  5. 數組的操作:
    數組是個很神奇的東西, 是一定要掌握的, 首先理解數組的概念, 嘗試操作一個數組, 最好數組的每個方法都實驗一下(一共也沒幾個方法), 還是建議通讀手冊相關章節.
  6. 字串的操作:
    字串是 Javascript 的一個基礎資料類型, 應該是開發中接觸最多的一個資料類型, 字串在 Javascript 中可以被看作是數組(但也不完全是), 另外字串也有很多自己的方法, 建議通讀, 每個都做下實驗理解其作用.
  7. Dom 操作:
    Javascript 除了處理邏輯, 最終還是要服務於 HTML 的, 所以 Dom 操作是必不可少的, 入門階段可以簡單掌握一些基礎操作就好(能夠動態修改 Dom 就行).
  8. 事件:
    Javascript 最神奇的一點就是事件驅動, 有了事件, 就一切盡在掌握了, 學習了事件之後, 你的入門之旅也就基本結束了. 恭喜
入門後建議完成幾個實驗:
  1. 顯示目前時間:
    擷取時間各部分(年月日, 時分秒, 毫秒), 時分秒為個位元的話前面要補零. 可能的話最好做個時鐘.
    知識點: 字串, Date 對象, 簡單 Dom 操作, 定時器(提綱中沒有提到, 查詢手冊中關於 setTimeout 和 setInterval 部分)
  2. 表單資料驗證:
    驗證特定文字框中的資料是否合法, 比如類型檢查(是否是整形, 小數), 長度檢查, 格式檢查(社會安全號碼, 手機號, 日期, 特定格式)
    知識點: 表單操作, 簡單 Dom 操作, 理解資料類型, 事件應用, 字串學習(可擴充數組學習).
  3. 類比單選和多選組件:
    隨便用什麼 html 標籤當作 item, 寫一個 list 結構 (最合適的是 ul > li), 點擊 item 實現選中/取消選中狀態, 單選和多選都要實現, 並能得到選中結果.
    知識點: 較複雜 Dom 操作, 配合樣式, 數組的應用, 事件應用.
  4. 測試你的鍵盤:
    綁定鍵盤事件, 測試每個按鍵對應的索引值, 配合 Ctrl, Shift 按鍵組合, 自己研究下, 玩點花樣.
    知識點: 鍵盤事件, 其他(看花樣玩到什麼程度了)
附:
  1. Javascript 線上入門學習: http://www.codecademy.com/
    可以通過該網站線上學習 Javascript (線上編寫代碼, 得到結果), 從基礎學起, 一步步引導深入, 非常贊.
  2. 一個實驗室: http://jsfiddle.net/
    也是一個線上工具, 通過其他資料學習過程中可以在這裡做實驗, 非常方便. 另外除了原生 JS, 還有支援很多常用 JS 架構.
  3. 一個架構: http://jquery.com/
    jQuery 是個 js 架構, 所謂架構就是用原生的 js 封裝的一套工具庫, 有了架構, 當你組裝你的汽車時就不會只有難用的扳手和改錐了, 甚至有使用魔法的感覺.
  4. 一個編輯器: http://notepad-plus-plus.org/
    著名的免費開源編輯器. 不多說, 使用軟體和學習編程一樣, 摸索的過程是充滿驚喜的.
  5. 一本線上手冊: http://www.w3school.com.cn/js/index.asp
    w3cschool 還有其他相關教程, 都非常值得參考.
最後要說的: 掌握一門語言最好的辦法就是多做, 案頭上放一個編輯器一本手冊, 遇到問題做實驗查手冊, 沒有什麼是搞不定的; 另外學習是一件長期的事情, 有時候可能是痛苦的, 但痛苦和糾結過後得到的快感是任何事情無法比擬的, 加油~~~

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.