04-1. 以Blockly演繹變數概念

以下使用「雲林SONG」網站所提供的Blockly程式編輯器來演繹變數指定的概念。可直接使用以下連結開啟執行,或是下載壓縮包之後,使用瀏覽器軟體直接開啟Blockly.html即可。

Blockly為Google所提供的圖形化程式編輯器,類似於Scratch等積木堆疊式軟體,並有以下特色。

  • 免安裝。
  • 即時看到程式積木的程式碼。
  • 可看到程式積木的網頁執行結果。
  • 可以XML格式儲存程式積木。
  • 可讀取XML格式的程式積木。
  • 可儲存所產生的程式碼,有JavaScript、Python、Lua。

本單元旨在於讓學生體驗變數指定的概念,不帶入太多程式設計的內容,教師在教學時應適當掌控難度。

線上執行Blockly:

http://163.22.72.196/html5/Blockly/Blockly.html

http://cst_t.pancakeapps.com/Blockly/Blockly.html

下載離線版Blockly壓縮包:

https://goo.gl/ocIoT6

1. 點擊左方「變數」,使用「建立變數…」功能設定兩個變數,名稱分別為「x」、「y」

2. 將「指定x變數值成為」積木拖曳至編輯區,在「運算」區域拉出數字方塊,設定為「5」。接著用同樣方法,設定y的變數值為「7」

3. 設定變數x的值為變數y

4. 使用「字串」區域的功能,顯示出變數x與變數y的值。點擊畫面右下角的箭頭按鈕,看看執行的結果是否正確。

5. 指定右方顯示的語言為「Python」,再點擊右下角的下載按鈕,指定檔案名稱後存檔,作為下一節課之用。