javascript_basics

• JavaScript 課程 - 基礎篇

安裝工具

請先安裝 Visual Studio Code，包括以下擴充功能（extensions）：

• Live Server

目次

1. 測試及除錯工具
2. 常數和變數宣告
3. 運算子
4. 字串
5. 取得標籤「元素」
6. 流程控制
7. Object 物件
8. Array陣列
9. JSON
10. 函式的定義
11. 時間與計時器
12. window物件
13. 事件處理
14. 操作DOM
15. 正規表示法
16. AJAX
17. 同步 & 非同步

提問

• 通則
  • 「結業前」可提問、討論，要把多餘時間和資源，留給當前上課的學員。
• 寫信
  • E-mail: darren@darreninfo.cc
  • 信件標題寫上你的班別和姓名，或是在哪裡參與我的課程，例如 [資展 <班別和代號> / 臺大計中 / 聯成] 你的主旨 ○○○。
  • 提問的內容要與本專案有關，其它課程的部分，去請益原本授課的老師。
  • 不要把程式碼寄給我，可能沒時間看，討論儘量以解決問題的方向為主。
  • 不符合以上幾點，將直接刪除，敬請見諒。

作業

• 僅限授課學員。
• 同學之間可以互相討論，但千萬不要抄襲。
• 可以參考 cases 資料夾中的範例程式碼。
• 可以使用 AI 工具來輔助學習與開發，但請務必理解程式碼的內容與邏輯。
• 可以結合任何公開的 JavaScript 函式庫或工具，例如：
  • jQuery、Chart.js、Three.js、p5.js
  • CDN: Google Hosted Libraries、jsDelivr
• 作業說明
  • 作業 1 (30 分)
    • 求出 100 之內的質數，結合 DOM 元素的動態增減，發揮個人創意與風格（例如使用動畫或特效），依序輸出到網頁上。
    • 可以自訂數字範圍。
  • 作業 2 (30 分)
    • 使用 AJAX 技術，結合 Leaflet，將 自訂 Web API (YouBike) 的資料顯示在地圖上，並且可以點擊標記 (marker) 顯示站點資訊。
    • 每 1 分鐘更新一次資料（你也可以設定手動更新，或是設定更長時間）。
    • 你可以自訂 icon 樣式與顏色，或是加入其他互動功能。
  • 作業 3 (40 分)
    • 綜合應用所學，設計一個小型專案（例如待辦事項清單、簡易遊戲、資料視覺化等）。
    • 網頁要美觀且具備互動性，並且使用至少三種以上的 JavaScript 技術（例如 DOM 操作、事件處理、AJAX 等）。
• 其它工作使用教學（optional）
  • 程式與網頁開發者必備技能！Git 和 GitHub 零基礎快速上手，輕鬆掌握版本控制的要訣！
  • 如何使用 Markdown 語言撰寫技術文件
• 作業繳交方式
  • 課程結束後，兩個禮拜內繳交作業（可現場討論），不用給我程式碼，只要拍一段網頁操作的影片，展示你的功能；不限制時間長度，不一定要口頭說明，可以將用到哪些功能寫在網頁上。