<p style="font-size:30px;font-weight: bold;">跟著ChatGPT 學JavaScript (基礎篇)</p> --- <p style="font-size:20px;font-weight: bold;">目錄</p> [TOC] <br /> ## 我們學習的目標 從 0 開始學 JavaScript,搭配練習題,一步步讓你學會: * 基礎語法與概念(變數、條件、迴圈、函式) * 操作網頁(DOM 操作) * 事件處理(點擊、輸入等互動) * 基礎專案應用(像是計算機、待辦清單等) <br /> ## 課程 1:變數與資料型別 ✅ 學習目標: * 變數(const /let /var) * 資料型別(字串、數字、布林) ``` let name = "小明"; // 字串 const age = 25; // 數字 let isStudent = true; // 布林值(true/false) console.log(name); console.log(age); console.log(isStudent); ``` * let 可以改變值;const 是常數,不能改。 不太建議用var,因為var表示全域變數。 * console.log() 是把訊息印出來,幫助你看程式執行的結果。 <br /> #### 練習 1:請你完成下列練習 宣告一個變數 myName,內容是你的名字。 宣告一個變數 myAge,內容是你的年齡。 宣告一個變數 isHappy,內容是 true 使用 console.log() 印出這三個變數。 <br /> ## 課程 2:條件判斷(if / else) ✅ 學習目標: * if / else 判斷語句 * 比較運算子(`===, >, <, !==` 等) ``` let age = 18; if (age >= 18) { console.log("你是成年人"); } else { console.log("你還是未成年"); } ``` * `===`: 檢查是否完全相等(包含型別-比較嚴格) * `==`: 檢查是否完全相等 * `>=`: 大於等於 * `!=`: 不相等 ### 練習 2:條件判斷 宣告一個變數 score,給它一個數字分數。 用 if 判斷: 如果分數大於等於 60,印出「及格!」 否則印出「不及格~加油!」 <br /> ## 課程 3:迴圈(Loop) ✅ 學習目標: * for 迴圈語法 讓電腦幫你重複做事! ``` // 把 1 到 5 印出來 for (let i = 1; i <= 5; i++) { console.log(i); } ``` * let i = 1:從 1 開始 * i <= 5:只要 i 小於等於 5 就繼續跑 * i++:每次加 1 ### 練習 3:自己寫一個迴圈! 請你: 用 for 迴圈,把 1 到 10 的數字印出來 然後每個數字後面印一句:「我在學 JavaScript!」 範例輸出: ``` 1 我在學 JavaScript! 2 我在學 JavaScript! ... 10 我在學 JavaScript! ``` 🔍 小提示: 先了解如何同時輸出變數跟字串 <br /> ## 挑戰小遊戲: ### 「九九乘法表」 我們要印出從 1x1 到 9x9 的乘法表! 🔍 小提示: 要用到兩個迴圈 <br /> ### 猜數字小遊戲(簡易版) 遊戲規則: 給兩個數字,電腦是數字 5,使用者是數字 3, 如果使用者猜對,顯示「恭喜你猜對了!」 使用者猜錯就提示「太大」或「太小」 <br /> ### 猜數字小遊戲(進階) 遊戲規則: 電腦產生一個隨機數字(1~10) 使用者猜一個數字 如果猜對,顯示「恭喜你猜對了!」 猜錯就提示「太大」或「太小」 🔍 小提示: 可以用以下方法試試看 * Math.random( ) * Math.floor( ) * prompt( )
×
Sign in
Email
Password
Forgot password
or
By clicking below, you agree to our
terms of service
.
Sign in via Facebook
Sign in via Twitter
Sign in via GitHub
Sign in via Dropbox
Sign in with Wallet
Wallet (
)
Connect another wallet
New to HackMD?
Sign up