在前面兩天的學習中,我先掌握了「變數與資料型別」,知道如何儲存資料,並學會了「條件判斷」,讓網頁能依照不同情況做出選擇。今天的主題是「迴圈」,這是程式設計中非常重要的工具,能讓程式自動重複執行相同或相似的動作,而不需要手動撰寫多行相同程式碼。迴圈不僅讓程式更簡潔,也讓網頁具有更強的互動性和自動化能力。
在 JavaScript 中,常見的迴圈包括 for、while 和 do...while
。
for
迴圈通常用於已知重複次數的情況,例如:
for (let i = 1; i <= 5; i++) {
console.log("第 " + i + " 次練習");
}
這段程式會從 1 執行到 5,共印出五次訊息,每次 i 的值都會自動增加,方便追蹤循環次數。
while
迴圈適合在不確定執行次數,但有明確條件的情況下使用:
let count = 0;
while (count < 3) {
console.log("目前次數:" + count);
count++;
}
只要條件為真,程式就會持續執行,條件變為假時才停止。
do...while
迴圈則保證至少執行一次,然後再判斷條件是否繼續循環,非常適合需要先執行一次動作再檢查條件的場景。
迴圈通常與變數和條件判斷搭配使用:變數可以儲存計數或狀態,條件判斷決定迴圈是否繼續。舉例來說,可以利用迴圈遍歷陣列或物件,印出每個元素的內容,或者做累加計算、統計數據,這對於建立互動網頁、表單驗證、遊戲計分等功能非常實用。
迴圈的好處非常多:首先,它能大幅減少重複工作,讓程式更簡潔且易於維護;其次,它提高了程式的效率,因為電腦自動執行循環而不需要人工干預;再者,迴圈讓程式更具彈性與可擴展性,例如資料量增加時,只要修改條件或陣列內容,就能自動適應,而不必重寫大量程式碼。迴圈還能與函式、條件判斷結合,實現更複雜的邏輯,讓網頁真正能「思考、反應並重複操作」,增強使用者體驗。
學習心得:
我覺得迴圈非常方便,它能把原本需要多行的程式簡化,不必每次都重複打相同的指令,將重複的工作交給電腦完成,讓我們可以專注於更高層的邏輯設計。例如,如果想要印出從 1 到 100 的數字,使用迴圈只需要幾行程式碼,而不用手動輸入 100 行 console.log()。
理解迴圈後,我也更能體會變數、條件判斷和迴圈三者之間的關聯:變數負責儲存資料,條件判斷決定程式流程,而迴圈則負責重複執行特定動作。當這三個概念結合使用時,程式就能完成更智慧的互動功能,例如自動計分、動態內容生成、批量處理資料,甚至可以應用在表單驗證或遊戲邏輯設計上,提升程式的效率與靈活性。
這讓我對撰寫互動網頁更有信心,也更期待後續學習函式、事件和物件操作,能把程式設計得更完整、更有條理。透過迴圈,我開始理解程式不只是讓電腦執行指令,而是能像人一樣有邏輯思考和自動化能力,這種感覺非常有成就感,也讓我對未來開發互動網頁充滿動力。