iT邦幫忙

2026 iThome 鐵人賽

DAY 24
0
自我挑戰組

美術生的前端初體驗 : 從畫畫到網頁的30天系列 第 24 篇

Day 24|條件判斷:讓程式開始做選擇(If / Else)

  • 分享至 

  • xImage
  •  

本日分享自己學到的就是 JavaScript 裡的邏輯大腦——If / Else(條件判斷)。

實際網頁應用:表單輸入驗證
如果回到真實的網頁介面上,最常見的例子其實就是我在 Day 11 提到過的過的「表單」!
例如使用者在註冊帳號時,網頁需要檢查輸入的密碼長度是否符合規範:

let passwordLength = 5; // 使用者輸入的密碼字數

if (passwordLength >= 8) {
    console.log("密碼格式正確!");
} else {
    console.log("提示:密碼長度至少需要 8 個字元!");
}

也可以加上多重條件 else if 來處理更多狀況:
如果 密碼長度 >= 8 → 顯示「密碼格式正確」
再不然如果 密碼長度 > 0 → 顯示「密碼長度不足」
否則(完全沒填) → 顯示「請輸入密碼!」
以前覺得網頁會根據我的動作產生不同畫面的效果好神奇,今天才明白背後其實就是一連串 If / Else 在默默幫我們做選擇!

Day 24,學會了用 If / Else 給程式裝上邏輯大腦。


上一篇
Day 23|變數與資料
下一篇
Day 25|函式 Function
系列文
美術生的前端初體驗 : 從畫畫到網頁的30天 共 25 篇
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言