【Wokwi教學 Part 2】新手救星!寫錯程式沒關係,讓 Wokwi 手把手教你「除錯」與「排版」

在上一篇文章中,我們介紹了 Wokwi 這個強大的線上模擬器,讓大家不用花一毛錢,也不用擔心接錯線燒壞板子,就能輕鬆踏入 Arduino 與 MCU 的世界。


但對於剛入門的朋友來說,接線只是第一關,真正的「大魔王」往往是——寫程式(Coding)。


你是否曾經遇過這種狀況:興致勃勃地打完程式碼,按下執行,結果畫面一片紅字,模擬器動也不動?這時候千萬別氣餒!Wokwi 最貼心的地方就在於,它不只能模擬電路,更是一位嚴格卻友善的「助教」。今天這篇文章,我們就來看 Wokwi 如何幫我們找出程式錯誤,以及如何讓你的程式碼變得更漂亮。

寫程式難免會手誤,就算是資深工程師也常會漏打分號或是拼錯字。在傳統的開發環境(IDE)中,錯誤訊息有時候很晦澀難懂,但在 Wokwi 中,除錯變得直觀許多。


請看下面這張圖,這是當我們寫好程式,按下上方綠色的「Play」按鈕後,系統偵測到錯誤時的畫面:

WokwiPicture-3

1. 抓出拼字與大小寫錯誤

請看紅框處的錯誤訊息:

sketch.ino:14:3: error: expected ‘;’ before ‘Pinmode’

雖然這裡的錯誤訊息主要是指上一行可能缺了分號(通常編譯器會這樣誤判),但我們仔細看它標記的第 14 行程式碼:

C++

 
Pinmode(ledG, OUTPUT);

眼尖的你發現了嗎?Arduino 的語法是 C++,它是區分大小寫的。正確的指令應該是 pinMode(小寫 p),而不是 Pinmode(大寫 P)。Wokwi 雖然顯示了錯誤,但透過行數指引(Line 14),我們可以立刻回去檢查該行的拼字。

2. 抓出語法缺失(最常見的「分號」遺失)

再看看下面另一個紅框的錯誤提示:

sketch.ino:24:3: error: expected ‘;’ before ‘digitalWrite’

這是新手最容易犯的錯!在 C++ 語言中,每一行指令結束後都必須加上分號 ;
Wokwi 告訴我們,在第 24 行的 digitalWrite 之前,應該要有一個分號。這時候我們往上看第 23 行,果然發現 delay(timeR) 後面空空如也。

Wokwi 的優勢在於: 它不會只給你一個冷冰冰的錯誤代碼,而是直接截圖給你看程式碼的哪一行有問題,並用 ^~~~~ 符號標示出錯誤的位置。你只需要根據行號回去修正,就能順利解決問題。

二、 程式碼亂糟糟?一鍵「自動排版」變整齊

解決了程式錯誤,我們還要養成良好的 coding 習慣。新手寫程式時,常常因為複製貼上或是還不熟悉縮排(Indentation),導致程式碼像「義大利麵」一樣亂成一團(如下圖左側原始碼,括號與縮排並不對齊)。

凌亂的程式碼不僅看起來痛苦,更會讓你難以檢查邏輯錯誤(例如少了一個大括號 } )。Wokwi 內建了一個超實用的功能——Format Document(格式化文件)

WokwiPicture-2

如何使用?

操作非常簡單,只要在黑色的程式碼編輯區域中:

  1. 點擊滑鼠 右鍵

  2. 選擇選單中的 「Format Document」(或是記住快捷鍵 Shift + Alt + F)。

神奇的效果

按下之後,Wokwi 會自動幫你把所有的縮排對齊,括號層級分明。原本歪七扭八的程式碼,瞬間就會變得像教科書一樣標準工整。這對於閱讀長篇程式碼或是請教高手幫忙除錯時,是非常重要的禮貌與習慣喔!

三、 修正後的成果

當我們根據 Wokwi 的錯誤提示,將 Pinmode 改為 pinMode,補上遺失的分號,並使用自動排版整理後,程式碼就會像下圖這樣清爽且正確:

WokwiPicture-1

這時候再按下綠色的「Play」按鈕,你就會看到右邊的 Arduino 與麵包板上的 LED 燈,按照你設定的邏輯開始閃爍囉!

紅綠燈模擬分享: https://wokwi.com/projects/450270813109982209

完整程式分享如下:

				
					const int ledR = 12;
const int ledY = 11;
const int ledG = 9;
int timeR = 1500;
int timeY = 800;
int timeG = 2500;

void setup() {
  // put your setup code here, to run once:
  Serial.begin(115200);
  Serial.println("設備啟動");
  pinMode(ledR, OUTPUT);
  pinMode(ledY, OUTPUT);
  pinMode(ledG, OUTPUT);

}

void loop() {
  // put your main code here, to run repeatedly:
  digitalWrite(ledR, HIGH);
  digitalWrite(ledY, LOW);
  digitalWrite(ledG, LOW);
  Serial.println("紅燈亮");
  delay(timeR);
  digitalWrite(ledR, LOW);
  digitalWrite(ledY, HIGH);
  digitalWrite(ledG, LOW);
  Serial.println("黃燈亮");
  delay(timeY);
  digitalWrite(ledR, LOW);
  digitalWrite(ledY, LOW);
  digitalWrite(ledG, HIGH);
  Serial.println("綠燈亮");
  delay(timeG);
}

				
			

測試影片

結語

學習 MCU 控制板的過程中,「試誤(Trial and Error)」是必經之路。Wokwi 不僅提供了一個安全的練習場,更透過直觀的 錯誤提示(Error Highlighting) 與便利的 程式碼排版(Auto Formatting) 功能,大大降低了新手的挫折感。

下次看到「Build failed!」別再害怕,跟著 Wokwi 的指引,把 Bug 一隻一隻抓出來,你也能成為除錯大師!

下一篇文章,我們將進一步探討如何利用 Wokwi 模擬更多有趣的感測器模組。敬請期待!

P.S.: 想實作的朋友們,歡迎參考之前文章"【Arduino入門】如何用按鈕開關控制LED燈

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

返回頂端