函數的參數 (影視版)
-
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現在你可以開始創造自己的
程式碼菜譜啦！真好吃！
|
Inez Ng edited Chinese, Traditional subtitles for Function Parameters (Video Version) | |
|
|
Inez Ng edited Chinese, Traditional subtitles for Function Parameters (Video Version) | |
|
|
Inez Ng edited Chinese, Traditional subtitles for Function Parameters (Video Version) | |
|
|
Inez Ng edited Chinese, Traditional subtitles for Function Parameters (Video Version) | |
|
|
Inez Ng edited Chinese, Traditional subtitles for Function Parameters (Video Version) | |
|
|
Inez Ng edited Chinese, Traditional subtitles for Function Parameters (Video Version) | |
|
|
Inez Ng edited Chinese, Traditional subtitles for Function Parameters (Video Version) | |
|
|
Inez Ng edited Chinese, Traditional subtitles for Function Parameters (Video Version) |