JavaScript

學習路徑

1. 00
   課程簡介與學習地圖

   JavaScript 能做什麼、這條路徑怎麼學、需要準備什麼

   Interaction 10 minute(s)
2. 01
   開發者工具與主控台

   Chrome DevTools、Console 與 Network 面板

   Interaction導覽 15 minute(s)
3. 02
   在網頁中使用 script

   script 標籤、載入順序、defer 與第一次操作網頁

   Interaction 15 minute(s)
4. 03
   變數宣告：var、let、const

   識別字規則、作用範圍與提升

   Interaction實作 20 minute(s)
5. 04
   基本型別與型別轉換

   Number、String、Boolean、null、undefined 與轉換

   Interaction實作 20 minute(s)
6. 05
   運算子

   算術、比較、邏輯運算子與 == 和 ===

   Interaction實作 20 minute(s)
7. 06
   字串

   字串的寫法、跳脫字元、樣板字面值與常用方法

   Interaction實作 20 minute(s)
8. 07
   流程控制

   if、switch、for、while、break 與 continue

   Interaction實作 20 minute(s)
9. 08
   物件

   物件字面值、屬性存取、for…in 與參照

   Interaction實作 20 minute(s)
10. 09
    陣列

    陣列的特點、常用方法與 map、filter、reduce

    Interaction實作 25 minute(s)
11. 10
    JSON 與複製

    JSON 規則、stringify、parse 與淺複製和深複製

    Interaction實作 20 minute(s)
12. 11
    函式

    函式宣告、匿名函式、箭頭函式、this 與 bind

    Interaction實作 25 minute(s)
13. 12
    作用域與閉包

    全域與區域變數、區塊作用域與 closure

    Interaction實作 25 minute(s)
14. 13
    Math 物件

    亂數、取整數、三角函數與環狀排列

    Interaction實作 15 minute(s)
15. 14
    時間與計時器

    Date 物件、setTimeout、setInterval 與事件迴圈

    Interaction實作 20 minute(s)
16. 15
    取得與建立網頁元素

    getElementById、querySelector、createElement 與移除元素

    Interaction 25 minute(s)
17. 16
    屬性、自訂資料與樣式

    getAttribute、dataset、classList 與 style

    Interaction 20 minute(s)
18. 17
    DOM 元素集合

    NodeList、HTMLCollection 與轉成陣列

    Interaction實作 15 minute(s)
19. 18
    window 與 document

    window 的方法、location、history 與 document 屬性

    Interaction實作 15 minute(s)
20. 19
    事件處理

    addEventListener、滑鼠與鍵盤事件、事件物件與冒泡

    Interaction 25 minute(s)
21. 20
    表單

    文字欄、單選、多選與下拉選單的讀取

    Interaction 20 minute(s)
22. 21
    檔案上傳與預覽

    input type=file、FileReader 與上傳前預覽

    Interaction實作 15 minute(s)
23. 22
    正規表示法與表單驗證

    RegExp、字元類別、量詞與送出前的檢查

    Interaction實作 25 minute(s)
24. 23
    網頁測試伺服器

    為什麼需要本機伺服器、http-server 與 query string

    Interaction實作導覽 15 minute(s)
25. 24
    Promise

    非同步、callback hell 與 then、catch、Promise.all

    Interaction實作 25 minute(s)
26. 25
    async 與 await

    用同步的寫法處理非同步、錯誤處理與平行執行

    Interaction實作 20 minute(s)
27. 26
    AJAX：XMLHttpRequest 與 fetch

    不重新整理頁面就更新內容

    Interaction 25 minute(s)
28. 27
    物件導向：prototype

    建構函式、prototype 與原型鏈

    Interaction實作 20 minute(s)
29. 28
    物件導向：class

    類別、建構函式、方法、getter 與繼承

    Interaction實作 20 minute(s)
30. 29
    模組與建置工具

    ES 模組、npm、Babel 與打包工具

    導覽 20 minute(s)