# JavaScript|早安午安晚安我是迴圈💞 用 for 迴圈~~勇敢追愛~~💞 JavaScript for / forEach / switch 新手筆記:用「第幾天愛你/第幾天決定不愛你」和「打包早安午安晚安濃情蜜意」的範例,帶你從初始化、條件判斷到迭代條件,一次搞懂迴圈邏輯 🚀 ### ✰ for 陳述式 - 傳統迴圈 ```javascript! for (初始化 initialization; 條件 condition; 條件後動作 afterthought) { /* (針對這次達成目的做法) 每天一句早安午安晚安,直到你愛上我為止。 */ } ``` initialization ( 初始化 - init ): 在迴圈開始前執行一次,通常用於初始化迴圈的計數器。 🪬今天開始嘗試第一天 let i=0; condition ( 條件 ): 每次迴圈迭代前,會檢查這個條件。 如果條件為 true,則執行迴圈主體;如果為 false,則終止迴圈。 🪬設定止損點:第十天後你還沒愛上我,終止騷擾行為 i<=10; afterthought (結束條件 (condition) 時的變動): 在每次迴圈主體執行完畢後執行,通常用於更新計數器或其他變數。 🪬每過一天,就計算一次 i++; ↓ 跑看看吧,看有沒有被我愛(騷)到(擾) ```javascript! → 把愛你的流程組裝起來 〠 let = 1; //準備愛(騷)你(擾)的第一天 for(; i<=10; i++){ //超過第十天,每天愛(騷)你(擾)一次,超過第十天我就不煩你ㄌ console.log(`第 ${i} 天:早安 🌞`); console.log(`第 ${i} 天:午安 🍱`); console.log(`第 ${i} 天:晚安 🌙`);//表達式 } ``` ![image](https://hackmd.io/_uploads/ByhHzgytgg.png) 還挺...~~認~~ (擾) ~~真~~ (民)ㄉ... ↑ 很難看出每一天做了什麼 #### → 把每一天都裝起來!(for+for) ♞ 騷擾起手式: 把每一天拆出來 → 跑第一個 for 再把~~愛~~(騷)~~你~~(擾)全部列一遍 → 跑第二個 for ```javascript! let call = ['早安 🌞', '午安 🍱','晚安 🌙']; // call.length=3 let day = 1;//騷擾從第一天開始 for(; day<=10; day++){ console.log(`今天是第 ${day} 天喔~ 🫶`); for(let i=0; i<call.length; i++){ console.log(`${call[i]}`); } } /* step 1 宣告 i = 0;(初始化→從引索0(早安 🌞)開始跑) step 2 判斷是否為 true ; call.length=3 第一次 i=0 i(0)<3 → true ✓跑 印出{call[i]} → {call[0]} → 早安 🌞 第二次 i=1 i(1)<3 → true ✓跑 印出{call[i]} → {call[1]} → 午安 🍱 第三次 i=2 i(2)<3 → true ✓跑 印出{call[i]} → {call[2]} → 晚安 🌙 第四次 i=3 i(3)<3 → false ✘不跑 3不可能大於3 因此到此結束loop* / ``` ![image](https://hackmd.io/_uploads/rJCMgeZtgx.png) 這樣忽然嘎然而止,好像有點意外 我要宣告不愛你,讓你後悔!!!!〠 #### → 宣告第十一天不愛你!(for+if else) ```javascript! let call = ['早安 🌞', '午安 🍱','晚安 🌙']; let day = 1; //從第一天算起 for(; day<=11; day++){ // 第十一天還要動作,所以要劃到第十一天 if(day<=10){ //十天內包含十天我都還愛你 console.log(`今天是第 ${day} 天喔~ 🫶`); for(let i=0; i<call.length; i++){ console.log(`${call[i]}`); } }else{ //剩下的日子就不愛ㄌ console.log(`第 ${day} 天:你不愛我,那我也不愛你`); } } ``` ![image](https://hackmd.io/_uploads/BkGSggbYel.png) 好像已經有點太長ㄌ 剩下ㄉ咱下篇見~yahoo~✰ --- 📺 JS 新手宇宙 - EP . 02 [ 🩷 EP1 《 函式和參數名稱、傳值再也不會搞混! 》](https://hackmd.io/pPUQiXn2TgGJrDTSLJR6sw) ###### ( 你在這裡 ↓ ) [🩷 EP2 《 for 迴圈:愛你 10 天計畫 》](https://hackmd.io/@Ph6kL2hVQeu-dSTdobpoJw/rJF-uhgOll) [🩷 EP3 《 陣列 Array:push、pop、splice 魚塘管理💅 》](https://hackmd.io/@Ph6kL2hVQeu-dSTdobpoJw/ByqK9u-Klx) [🩷 EP4 《 物件 Object:80s 畢業紀念冊大曝光,二十年後我還記得你 💘 》](https://hackmd.io/@Ph6kL2hVQeu-dSTdobpoJw/SkkxzBY9ee)