(一）學前小知識
- 應用在網頁前端
- Google的搜尋bar 自動出現你想搜尋的關鍵字
- 網站註冊頁面的欄位輸入檢查
- Amazon 上的特定圖片放大效果
- 如果要應用在後端(背景、伺服器執行），要多學習 Node.js
(二）學前小準備
- 安裝 Chrome
- 安裝 Brackets -> 下載位置: http://brackets.io/contribute.html
- 免費，且跨平台的強大編輯器
- 豐富的插件可以安裝
- 內建其他編輯器需要的安裝插件才有的功能
- 與 PhotoShop 深度整合
- 強大的 Live Preview 功能
- Brackets 教學 (for Mac) : https://www.youtube.com/watch?v=efhSGPXzQMU
- 必裝插件:
- Emmet : 提供 Brackets 快速輸入 HTML 與 CSS 的簡潔語法 ( ! + Tab)
- Custom Work : 提供 Brackets 檔案分頁標籤的功能
- Beautify : 存檔時，幫助將程式碼美化
- 推薦插件 : Todo、Git、Terminal
- 必裝插件:
- 其他 Editor (相關介紹 : https://www.youtube.com/watch?v=TIF7IqVkJlU )
- Github 帳號建置
(三) 課程大綱
| 1 | 數，字串，布林值 | |
| 2 | 變數 | |
| 3 | 邏輯AND(而且)，OR(或者)，與相等性判斷 | |
| 4 | 條件判斷 if, else if, else | |
| 5 | 迴圈 | while、do/while、for 及 for/in |
| 6 | 陣列 | // 陣列(Array) 條狀(1維)容器 // 宣告陣列的方式：使用 [ ] |
| 7 | 物件 | 宣告物件的方式：var a = ( ); // 一個空的物件 |
| 8 | 函式 | function declaration () {}; var funcExpression = function () {}; var namedFuncExpression = function named() {}; |
| 9 | 可視範圍與執行環境 | 「可視範圍」：變數可以在哪裡被找到 「執行環境」：程式執行的時候到哪裡找變數。 |
| 10 | 函式中的 this | |
| 11 | 回呼函式 callback | |
| 12 | 用 JavaScript 控制網頁上的元素 |
