1
00:00:01,120 --> 00:00:04,703
現在讓我們談談這段時間
你們一直在使用的東西：

2
00:00:04,703 --> 00:00:05,760
函數

3
00:00:05,760 --> 00:00:09,746
每當你使用指令時，像是
rect() 或 fill() 或 text()

4
00:00:09,746 --> 00:00:11,585
你就在召喚函數

5
00:00:11,585 --> 00:00:14,839
而那些函數依照你的指令去繪圖

6
00:00:14,839 --> 00:00:16,320
函數到底是什麼？

7
00:00:16,320 --> 00:00:19,870
它是一連串我們集合起來
並給予名稱的程式碼

8
00:00:19,870 --> 00:00:23,768
因為我們想能夠多次地
重複使用哪一點功能

9
00:00:23,768 --> 00:00:26,322
想一想 rect()
rect() 做的是什麼？

10
00:00:26,322 --> 00:00:28,612
它畫出四條線，對吧？

11
00:00:28,612 --> 00:00:31,513
我們也可用 line() 函數
做出相同的，是吧？

12
00:00:31,513 --> 00:00:34,044
而我們也能得到一個貌似矩形的繪圖

13
00:00:34,044 --> 00:00:36,113
但是我們發現

14
00:00:36,113 --> 00:00:39,357
我們也想能夠多次繪畫矩形

15
00:00:39,357 --> 00:00:43,050
如果每次都要計算怎麼
從一個角落畫直線到另一個角落

16
00:00:43,050 --> 00:00:45,493
再從一個角落到另一個角落
就會變得很惱人

17
00:00:45,493 --> 00:00:48,083
與其那樣
我們不如寫一個 rect() 函數

18
00:00:48,083 --> 00:00:50,673
而該函數做的正正就是這

19
00:00:50,673 --> 00:00:54,565
跟那四行編碼做的一模一樣
只是所需的碼少很多

20
00:00:54,975 --> 00:00:56,975
那還蠻酷的

21
00:00:56,975 --> 00:01:02,271
而 rect() 是其中一個在可汗學院
所有學習課程中都可使用的函數

22
00:01:02,271 --> 00:01:07,719
但是，你也可以在你的程式裏
寫自己的函數

23
00:01:07,719 --> 00:01:10,479
例如：我們設計一個程式

24
00:01:10,479 --> 00:01:13,979
讓我們能多次繪製溫斯頓

25
00:01:13,979 --> 00:01:16,802
說不定說個有關他的生命故事

26
00:01:16,802 --> 00:01:20,155
然後展示出他人生裏的
每個年齡階段

27
00:01:20,155 --> 00:01:24,245
所以我們的溫斯頓繪製碼是可能是這樣：

28
00:01:24,245 --> 00:01:26,995
我們有 faceX 和 faceY 變數

29
00:01:26,995 --> 00:01:28,555
來儲存臉的中心位置

30
00:01:28,555 --> 00:01:30,257
然後我們畫上眼和嘴

31
00:01:30,257 --> 00:01:32,597
相對著那些變數

32
00:01:32,597 --> 00:01:34,717
現在程式可以看到編碼

33
00:01:34,717 --> 00:01:37,687
它不是在任何函數中
所以會直接執行

34
00:01:37,687 --> 00:01:39,905
而且只執行一次

35
00:01:39,905 --> 00:01:43,467
好的，把它變成一個函數

36
00:01:43,467 --> 00:01:47,554
這一步很似我們宣告變數的步驟

37
00:01:47,554 --> 00:01:49,136
因為其實那正是我們在做的

38
00:01:49,136 --> 00:01:52,055
所以我們寫 var drawWinston

39
00:01:52,055 --> 00:01:54,340
幫它取個好名字，高描述性

40
00:01:54,340 --> 00:01:55,711
然後一個 =


41
00:01:55,711 --> 00:01:59,131
但在這，我們不寫一個數字或一個字串

42
00:01:59,131 --> 00:02:02,904
而直接寫 function 
確定你拼對

43
00:02:02,904 --> 00:02:06,053
之後一個空白括號 ()

44
00:02:06,053 --> 00:02:08,183
然後一個開花括號 {

45
00:02:08,183 --> 00:02:09,723
再一個關花括號 }

46
00:02:09,723 --> 00:02:11,261
和最後的分號 ;

47
00:02:11,261 --> 00:02:15,395
很好，我們需要做的是
將我們想要的所有東西

48
00:02:15,395 --> 00:02:18,772
放進函數的開和關花括號之間

49
00:02:18,772 --> 00:02:21,651
我們就把所有編碼放進去

50
00:02:21,651 --> 00:02:25,713
放它進我們的函數裏 
排好內縮，然後

51
00:02:25,713 --> 00:02:26,703
噔噔！

52
00:02:26,703 --> 00:02:28,783
現在我們有的便是這變數

53
00:02:28,783 --> 00:02:30,337
它存着一個函數


54
00:02:30,337 --> 00:02:34,113
也就是說我們給了
這編碼區塊一個標籤

55
00:02:34,113 --> 00:02:36,616
以便我們於任何時間告訴我們的程式：

56
00:02:36,616 --> 00:02:40,816
嘿！找出那個有標籤的
編碼區塊然後執行它！

57
00:02:40,816 --> 00:02:43,524
我們正令這編碼變得可再用

58
00:02:43,524 --> 00:02:46,394
但注意，我們現在沒有任何溫斯頓！

59
00:02:46,394 --> 00:02:48,999
我們丟了溫斯頓！
他跑了去哪裡？

60
00:02:48,999 --> 00:02:52,920
好的，當我們放這於函數裏

61
00:02:52,920 --> 00:02:55,630
我們便告訴了程式：
嘿，這裡有一堆程式碼

62
00:02:55,630 --> 00:02:57,840
我想稍後能夠執行

63
00:02:57,840 --> 00:03:00,579
但只當我叫你去執行時才動手

64
00:03:00,579 --> 00:03:03,769
我們需告訴它去執行程式碼

65
00:03:03,769 --> 00:03:06,364
就是指我們需召喚函數

66
00:03:06,364 --> 00:03:09,464
就如我們執行ellipse() 和 
rect() 和 line() 時一樣

67
00:03:09,464 --> 00:03:13,718
我們寫下函數名稱 
drawWinston

68
00:03:13,718 --> 00:03:16,037
隨後接上一個括號 ()

69
00:03:16,037 --> 00:03:18,397
當然還有分號 ;

70
00:03:18,397 --> 00:03:19,259
噔噔！

71
00:03:19,259 --> 00:03:20,911
我們有個溫斯頓了！

72
00:03:20,911 --> 00:03:23,830
好，我覺得它很酷
但你可能不覺它很酷

73
00:03:23,830 --> 00:03:28,578
因為我們做的一切
就是程式做它之前就會做的

74
00:03:28,578 --> 00:03:29,948
有點好笑吧？

75
00:03:29,948 --> 00:03:32,661
函數的用意就在於重複使用

76
00:03:32,661 --> 00:03:34,598
現在就來試試

77
00:03:34,598 --> 00:03:37,588
我們可以復製貼上這函數召喚

78
00:03:37,588 --> 00:03:40,894
噔噔！噔噔！
一遍又一遍地

79
00:03:40,894 --> 00:03:44,304
嗯，但看起來好像一樣

80
00:03:44,304 --> 00:03:45,862
喔，成功了

81
00:03:46,402 --> 00:03:48,082
它繪出了許多溫斯頓

82
00:03:48,082 --> 00:03:50,965
但問題是它們全在同一個地方

83
00:03:50,965 --> 00:03:53,895
如果我們有X光眼的話
就是可以看穿畫布

84
00:03:53,895 --> 00:03:55,552
看見三個溫斯頓

85
00:03:56,402 --> 00:04:00,352
但我沒有X光眼 
(我不知道你)

86
00:04:00,352 --> 00:04:03,164
但是，我們可以對函數
做一些小小的改變

87
00:04:03,164 --> 00:04:04,585
讓它現身

88
00:04:04,585 --> 00:04:08,752
你看 faceX 和 faceY 
它們永遠都是202 和 208

89
00:04:08,752 --> 00:04:11,661
我們可利用
函數 random() 來改變這

90
00:04:11,661 --> 00:04:14,491
要不 random() 從 50 到 350

91
00:04:14,491 --> 00:04:16,764
它便會隨機產生一個
於那兩數之間的數字

92
00:04:16,764 --> 00:04:18,943
我們可以在這做一樣的

93
00:04:18,943 --> 00:04:21,503
所以每當這函式被召喚時

94
00:04:21,503 --> 00:04:23,423
它便會產生這新的隨機數

95
00:04:23,423 --> 00:04:26,689
如果我們按 restart
我們便可得到隨機溫斯頓

96
00:04:26,689 --> 00:04:28,423
太厲害了！

97
00:04:29,863 --> 00:04:31,472
好，我覺得這很酷因爲


98
00:04:31,472 --> 00:04:34,717
如果我們沒有擺它在函式裏
原本該需要一大堆編碼來寫這

99
00:04:34,717 --> 00:04:37,328
本來會有三倍的程式碼

100
00:04:38,358 --> 00:04:40,779
不過目前仍然不是它用處的極致

101
00:04:40,779 --> 00:04:43,425
因爲我們大概不想要隨機溫斯頓

102
00:04:43,425 --> 00:04:46,904
我們也許想能夠放將溫斯頓
在螢幕上一個固定的地方

103
00:04:46,904 --> 00:04:47,900
所以請密切留意

104
00:04:47,900 --> 00:04:51,531
因爲我們將講解
如何傳遞參數給函數

105
00:04:51,531 --> 00:04:54,380
而你便能學會做那