< Return to Video

函數的參數 (影視版)

  • 0:01 - 0:06
    我們又回到「繪製溫斯頓」這個程式了
    但我加了一些文字
  • 0:06 - 0:11
    看,我想做的就是
    放一個溫斯頓在每一個標籤下面
  • 0:11 - 0:13
    來顯示他不同的人生階段
  • 0:13 - 0:15
    現在他在螢幕上到處亂竄
  • 0:15 - 0:20
    這是因為我們把這函數裡的
    faceX 和 faceY 設成隨機數
  • 0:20 - 0:27
    但是我們要做的是「嘿,這就是
    我想你把這溫斯頓畫到的指定位置。」
  • 0:27 - 0:30
    我想每次召喚函數的時候
    都能準確說明它的位置
  • 0:30 - 0:34
    就像我們設定
    ellipse() 和 rect() 的時候一樣
  • 0:34 - 0:40
    我想放溫斯頓在這裡、這裡、一個
    溫斯頓在這裡、一個溫斯頓在這裡
  • 0:40 - 0:44
    我不想每次召喚函數的時候
    溫斯頓隨機亂跑
  • 0:45 - 0:49
    要做到這一點
    我們需要指定函數裡的參數
  • 0:49 - 0:53
    既要在函式定義裡設置參數
    頂部這裡
  • 0:53 - 0:57
    也要在召喚函數裡設置參數
    下面這裡
  • 0:57 - 1:03
    在 drawWinston() 裏
    我們給它傳遞 faceX 和 faceY
  • 1:03 - 1:10
    讓該函數使用我們傳遞的值
    而不是使用隨機產生的值
  • 1:10 - 1:15
    我們先想想要在下方的函數召喚
    傳遞什麼數值
  • 1:15 - 1:18
    我們想要把溫斯頓放在每行文字下面
  • 1:18 - 1:24
    所以我們該想要每個溫斯頓的 x 跟 y
    跟 text() 的座標非常相近
  • 1:24 - 1:28
    可能溫斯頓的 y
    比文字的低10個像素左右
  • 1:28 - 1:41
    那第一個的就是 10, 30
    然後 200, 230 ... 10, 230 ... 200, 230
  • 1:41 - 1:45
    跟文字座標是一樣的
    只是每一個 y 我都加了10
  • 1:45 - 1:48
    因為我只想它低一點點
  • 1:50 - 1:52
    但溫斯頓沒有動
  • 1:52 - 1:57
    這是因爲我們沒有告訴上面的函數
    我們正傳遞它參數
  • 1:57 - 2:00
    所以它還在用這些隨機值
  • 2:00 - 2:04
    為了告訴這些函數「我們要給你這些資訊啦」
  • 2:04 - 2:08
    我們須在這些括弧裡輸入參數的名稱
  • 2:08 - 2:15
    我們將其命名為 faceX 和 face Y
    用逗號隔開
  • 2:15 - 2:21
    這樣命名是因為在該函數裡面
    我們已經用了這些名字
  • 2:21 - 2:25
    這樣我們就不用重寫其餘的程式碼了
  • 2:25 - 2:29
    但是仍然什麼都沒有發生
    溫斯頓還是周圍亂跑
  • 2:29 - 2:31
    如果你看看我們頂部的函數
  • 2:31 - 2:36
    你會發現隨機值
    還是覆蓋在 faceX 和 faceY 上
  • 2:36 - 2:40
    所以我們要做的
    就是把這兩行都刪掉
  • 2:40 - 2:46
    噔噔!現在 faceX 和 faceY 傳到函數裡了
  • 2:46 - 2:50
    而且使用我們在下面召喚的值
  • 2:50 - 2:54
    但是如你所見,溫斯頓擺放的位置不是很正確
  • 2:54 - 3:02
    因為我忘記了文字是左對齊
    臉則是居中
  • 3:02 - 3:06
    所以我只需要修改一下我的數字,對吧?
  • 3:06 - 3:12
    我要把 x 右移很多, y 下移一點
    好了,小孩溫斯頓弄好了
  • 3:12 - 3:15
    繼續修改
  • 3:15 - 3:23
    現在只要修改一下函數的參數值即可
    完全不用修改函數定義
  • 3:23 - 3:26
    它會使用我們傳給它的任何值
  • 3:26 - 3:29
    就像製作 ellipse() 和 rect() 時一樣
  • 3:29 - 3:33
    我已經差不多擺放好了
    但我發現溫斯頓有點大
  • 3:33 - 3:36
    他正重疊在一起
    他的大小不大對勁
  • 3:36 - 3:39
    由於我放了畫出溫斯頓的程式碼
    在一個函數裏
  • 3:39 - 3:42
    我能夠一次改變全部的大小
  • 3:42 - 3:46
    只要修改這行畫橢圓的程式碼即可
  • 3:46 - 3:51
    讓我們將他改成 190
    耶,溫斯頓減肥了!和 190
  • 3:51 - 3:55
    現在他的大小合適了
    然後,我還可以微調一下
  • 3:55 - 3:59
    這樣我就能把他放進去了是不是?
  • 4:01 - 4:02
    酷!
  • 4:03 - 4:06
    讓我們來回顧下這程式碼的功能
  • 4:06 - 4:09
    它定義了一個叫做 drawWinston() 的函數
  • 4:09 - 4:15
    這函數有兩個值
    標名為 faceX 和 faceY
  • 4:15 - 4:20
    實際上這兩值就是變數
    我們可在函數裏任何地方使用它們
  • 4:20 - 4:24
    就像我們以前用於
    宣告在頂部的變數一樣
  • 4:25 - 4:29
    宣告了之後便可隨時召喚這函數
  • 4:29 - 4:34
    我們可以傳遞不同的值
    而函數便會使用這些新的值
  • 4:35 - 4:37
    你見證了這些函數的神奇效應
  • 4:37 - 4:41
    我們可以設計一些
    我們覺得好用的程式碼來重複使用
  • 4:41 - 4:43
    但我們也可以利用參數來說
  • 4:43 - 4:46
    「嘿,你可以在這程式碼裏
    修飾一下這小東西。」
  • 4:46 - 4:49
    就像一個菜譜,你寫下總體指令
  • 4:49 - 4:53
    如果你突然發現你要餵飼的
    是四個溫斯頓而不只是一個
  • 4:53 - 4:56
    你不用一切重新開始
    你只需要調整一下指令原文
  • 4:56 - 4:58
    並把一切乘上4即可
  • 4:58 - 5:03
    現在你可以開始創造自己的
    程式碼菜譜啦!真好吃!
Title:
函數的參數 (影視版)
Description:

本影片為互動編程實作影片講解剪輯,目的為便字幕製作與翻譯。更完整的影片目錄請見:https://www.khanacademy.org/cs/programming/

more » « less
Video Language:
English
Duration:
05:05

Chinese, Traditional subtitles

Revisions