程式語言家教

看不懂程式碼?免費「程式語言家教」在這裡!

最後更新時間: 2021 年 9 月 1 日

學程式語言的過程中,面對一大串的程式碼,你是否有閱讀上的困難?

想找個老師教你如何讀程式碼,了解程式是怎麼跑的?

需要非常仔細的程式碼解說教學?

關於這些問題,有個免費的程式語言家教可以幫你。

Python、Java、C、C++、Javascript、Ruby 六種程式語言,都可提供免費的程式碼解說。

幫你解析程式碼運作的流程,一步一步的講解,並且提供各個階段的結果,以視覺化的方式讓你馬上就懂。

程式語言家教 Python Tutor

首先,請你不要驚慌,儘管這個免費家教需要使用一點點英文,但基本上不需要閱讀英文文章或是聽、說英文,只要記得幾個單字,會點選按鈕及複製貼上即可。

就好像現在很多車子使用按鈕發動引擎,按鈕大多也只是寫個 START ,會讓你很驚慌嗎?

不會,對吧。

你只需要知道按鈕在哪,一樣可以開車,使用這個免費的程式語言家教也是一樣,你只需要知道如何貼上程式碼,啟動教學,讓家教幫你一行一行解析即可。

不需要口說、視訊、讀英文文章,都不用,只要貼上程式碼、按下按鈕。

來看看如何呼叫這個程式語言家教吧!

第一步-連線到 Python Tutor 網站

點選下方按鈕連結,或是在瀏覽器上輸入網址:pythontutor.com/

進到 Python Tutor 網站後,你會看到下方的文字。

雖然都是英文的,但不用緊張,找到你所使用的程式語言名稱,點進去,便會進到教學頁面,會運用文字及圖像教學,完全不用視訊或英文口說。

Python Tutor 首頁,面對英文介面你可以使用翻譯,或是簡單認識一點點英文按鍵即可,免驚!

又或者,使用瀏覽器的翻譯套件(例如在chrome瀏覽器安裝翻譯套件,直接翻譯頁面),將頁面轉換成繁體中文。

使用 chrome 翻譯套件將網頁中文化

(本文以原文圖片解說,如果你把網頁翻譯成中文,就比照相對位置操作即可)

點選 Start visualizing your code now ,就會進入下圖的頁面,預設為 Python 語言,下拉選單可以選擇其他種類。

如果你是在首頁點選 Related services 那一行的程式語言,下拉選單只會有該程式語言,需要轉換語言,就到首頁點選其他語言。

第二步-貼上需要講解的程式碼

貼上你要解說的程式碼,必須是可以正常運轉的程式碼,如果有錯誤,會在貼上的區塊下方以紅字提醒。

貼好程式碼後,在下方的 Visualize Execution 灰色按鈕,字面的意思是視覺化執行,就是把你貼上的程式碼進行視覺化。

第三步-程式碼解說教學

點擊視覺化按鈕後,按鈕上方會顯示產生教學需要的秒數,稍等一下就會跳入教學頁面,如下圖。

圖片解說太複雜?就直接按 Next 按鍵吧,你會知道怎麼操作的。

進入程式碼解說教學,按下 Next 按鈕開始運作程式,紅色箭頭代表目前程式碼執行的位置,已經運作過的會用綠色箭頭表示。

頁面右下方區塊,解說程式是怎的跑的,會將框架與物件都說明清楚。

解說欄位是程式碼執行過程的說明

每一個步驟的解說都會在頁面的右邊顯示,右上角的方框是程式運作的結果,方框的右下角有個小灰點,將滑鼠游標移過去,可以縮放視窗大小。

呈現結果的視窗,如果太小而擋到文字,拉大就可以看到全部了。

其他的按鍵說明:

  • Prev:上一步
  • First:回到第一步
  • Last:直接跳到最後一步
  • step 4 of 57(此為例子):程式碼總共 57 個步驟,目前在第 4 步。
    這裡提供的數字是舉例,數值會因程式碼長短,及處於哪個階段而改變。
  • generate permanent link:為這個程式碼教學產生一個網址。
    產生網址類似把你貼上的程式碼存起來,下次輸入該網址便可直接看教學。
  • generate embed code :為這個程式碼教學產生嵌入代碼。

下方的影片,以英文說明如何使用 Python Tutor,並教你如何線上發問:


Python Tutor 是一個很實用的解說程式碼家教網頁,一步一步的帶著你看程式是怎麼運作。

本文中的教學圖片所舉的例子,是簡單的一段程式碼,基本上不太需要解說,但對於觀念不清楚的初學者來說,是很好的理解方式,像是不知道迴圈怎麼跑,使用 Python Tutor 便清楚明瞭。

除此以外,碰到比較複雜的程式碼看不懂,Python Tutor 更是一大救星。

《Python 自動化的樂趣》第二版 第十一章的範例

上圖是稍微複雜一點的程式碼,有了 Python Tutor 這個程式語言家教的詳細的解說,對於梳理邏輯幫助很大,推薦給正在學習程式語言的你,以及需要詳細程式碼解說的朋友們。

延伸閱讀:

Python觀念,從 = 開始

Python if 陳述句的基礎與操作

Python字串基礎與20種常見操作

Python串列(list) 基礎與23個常用操作

Python字典(dictionary)基礎與16種操作

Python正規表示式:不一定要會,但會了超省力

5本Python書推薦,強化你的程式語言觀念

學Python可以做什麼:9個Python應用報你知

12個入門Python線上課程:讓你快速學會寫程式

Leave a Comment

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