1
00:00:01,082 --> 00:00:04,244
我們回到那顯示我的陣列 (array) 朋友的程式

2
00:00:04,244 --> 00:00:06,854
但是有一些事真的惹惱了我

3
00:00:06,854 --> 00:00:09,472
每次我添加一個新朋友到陣列中 都要補充

4
00:00:09,472 --> 00:00:11,403
一個新的文字命令 (text command) 到這裡

5
00:00:11,403 --> 00:00:13,232
假設我加了溫斯頓

6
00:00:13,232 --> 00:00:15,333
他不會自動顯示出來

7
00:00:15,333 --> 00:00:19,915
如果我要他露面 我得說 
text(myFriends[3],

8
00:00:19,915 --> 00:00:23,093
然後更改位置 y 
才可以看到溫斯頓

9
00:00:23,093 --> 00:00:24,982
這實在是很麻煩

10
00:00:24,982 --> 00:00:28,382
我希望每次加入別人到陣列時
他都會自動顯示出來

11
00:00:28,385 --> 00:00:31,308
程式會自動做那個文字命令

12
00:00:31,308 --> 00:00:34,396
好了 還記得我們學過迴圈嗎？

13
00:00:34,397 --> 00:00:38,546
迴圈是個偉大的方式
可以多次重複相同的代碼

14
00:00:38,546 --> 00:00:43,307
就像 如果我們想要有連續的一堆樹木
或一串氣球

15
00:00:43,307 --> 00:00:49,767
事實證明 迴圈也是陣列的元素上運行代碼中
很棒的方式

16
00:00:49,777 --> 00:00:53,617
事實上 每次使用陣列時 你幾乎都會用到迴圈

17
00:00:53,617 --> 00:00:57,348
他們一起工作真的很配

18
00:00:57,348 --> 00:01:00,088
為了讓你明白我的意思
我不用文字命令

19
00:01:00,088 --> 00:01:03,698
而是用一個迴圈
來顯示我朋友名字

20
00:01:03,698 --> 00:01:07,683
我們將從三個問題開始
當我們做迴圈時 總是會問自己

21
00:01:07,683 --> 00:01:10,992
首先 我想重複的是什麼？ 
看過內容後，什麼是重複的？

22
00:01:10,992 --> 00:01:13,042
就是文字命令 (text command)

23
00:01:13,042 --> 00:01:16,564
我每次想改變什麼？ 
就讓我看看有什麼不同

24
00:01:16,564 --> 00:01:20,004
位置 y 和當前的索引指數 (index) ，是吧？

25
00:01:20,004 --> 00:01:25,613
就是 NUM 這位朋友和位置 y

26
00:01:25,613 --> 00:01:28,138
那我們應該重複多久？ 


27
00:01:28,138 --> 00:01:32,940
繼續下去 直到沒有其它朋友

28
00:01:32,940 --> 00:01:36,970
好 現在我們知道想要什麼
可以做個迴圈

29
00:01:36,970 --> 00:01:40,523
我們從計數器變量 (counter variable) 
開始追蹤迴圈位置

30
00:01:40,523 --> 00:01:44,352
所以我們說 var friendNum = 0;

31
00:01:44,352 --> 00:01:48,567
計數從零開始
因為 0 是陣列中的第一個元素

32
00:01:48,567 --> 00:01:50,518
1 不是第一個元素

33
00:01:50,518 --> 00:01:57,848
我們有 while 迴圈 所以我們說
while(friendNum < my friends.length)

34
00:01:57,869 --> 00:02:03,967
現在我們要比較
當下計數器變量與陣列中元素的總數

35
00:02:03,967 --> 00:02:07,248
迴圈中 這裡是使用文字命令處

36
00:02:07,248 --> 00:02:09,182
我們說 text(myFriends[

37
00:02:09,182 --> 00:02:15,381
而這裡我們放 friendNum 不放數字 
因為 friendNum 代表當前的數量


38
00:02:15,381 --> 00:02:18,279
我們目前為止只放一個位置 y

39
00:02:18,279 --> 00:02:22,092
OK 這給了我們一個無限迴圈的錯誤 


40
00:02:22,092 --> 00:02:25,663
因為我們還沒有改變 friendNum

41
00:02:25,663 --> 00:02:27,772
請記住 每次迴圈都需要遞增 friendNum

42
00:02:27,772 --> 00:02:32,646
否則條件為真 迴圈會永遠繼續下去

43
00:02:32,646 --> 00:02:38,213
我看到某些事情發生了 
讓我註釋掉舊代碼 看看發生了什麼事

44
00:02:38,213 --> 00:02:43,542
我們想現出所有的名字 但是他們都被蓋掉了

45
00:02:43,543 --> 00:02:45,256
因此 我們需要改變位置 y

46
00:02:45,256 --> 00:02:49,798
讓我們就說 'friendNum*30'


47
00:02:49,798 --> 00:02:52,289
這很好 但索菲亞關閉銀幕


48
00:02:52,289 --> 00:02:55,426
索菲亞如果發現了這一點 她會很不高興

49
00:02:55,426 --> 00:02:59,648
那就讓我們加 30 
現在全部都差距 30

50
00:02:59,648 --> 00:03:04,051
好棒！現在你看 我們有顯示陣列的迴圈

51
00:03:04,051 --> 00:03:09,119
這意味著如果我們增加更多的人
像是蓋伊 或者是薩爾 Sal

52
00:03:09,119 --> 00:03:11,743
如果我只加 薩爾 Sal 到陣列
薩爾他會成為我的朋友

53
00:03:11,743 --> 00:03:13,702
真棒！現在 他是我哥們了

54
00:03:13,702 --> 00:03:18,283
呃... 你可以看到 新朋友是自動顯示

55
00:03:18,283 --> 00:03:20,886
因為它始終排在陣列裡


56
00:03:20,886 --> 00:03:24,305
我們可以刪除舊代碼
因為不再需要它

57
00:03:24,305 --> 00:03:28,566
我們檢視整個代碼 並查看它是在做什麼

58
00:03:28,566 --> 00:03:31,445
我們從 friendNum 等於零開始

59
00:03:31,458 --> 00:03:34,354
我們檢查看看 friendNum 是否小於當前長度

60
00:03:34,354 --> 00:03:37,706
你可以想像 0 比 6 小 確實如此

61
00:03:37,706 --> 00:03:41,940
於是 我們從這裡進去 
我們說 我的朋友 friendNum

62
00:03:41,940 --> 00:03:44,618
所以這將是我的第零個朋友 第一次

63
00:03:44,618 --> 00:03:47,588
然後 30 加上 0 乘以 30

64
00:03:47,588 --> 00:03:53,750
它顯示索菲亞在位置 10 和 30 上
就是這樣的

65
00:03:53,771 --> 00:03:56,550
然後用 friendNum ++
於是 friendNum 就變成 1

66
00:03:56,550 --> 00:03:59,220
然後它返回說：
1 比 myfriends.length 的長度小嗎？

67
00:03:59,220 --> 00:04:00,041
是啊 沒錯

68
00:04:00,041 --> 00:04:02,012
迴圈這樣一直保持下去...

69
00:04:02,012 --> 00:04:07,452
最後我們來到薩爾
記住 薩爾在陣列中其實是第六元素

70
00:04:07,452 --> 00:04:11,052
但他的索引指數 (index) 是 5 
因為指數從零開始

71
00:04:11,052 --> 00:04:13,803
那麼 5 比 6 小？是

72
00:04:13,803 --> 00:04:16,032
因此 顯示 myfriends 等於 5

73
00:04:16,032 --> 00:04:20,222
然後 它變成 6 
我們問 6 比 6 小嗎？

74
00:04:20,239 --> 00:04:23,168
錯！ 6 等於 6
因此這是錯誤的

75
00:04:23,168 --> 00:04:25,608
因此 它永遠不會顯示第六個元素

76
00:04:25,608 --> 00:04:29,807
這很好 因為指數 6 沒有任何人

77
00:04:29,807 --> 00:04:33,328
有第六元素 但沒有人在指數六

78
00:04:33,328 --> 00:04:37,009
這可能令人混淆 他是 0 也是 1

79
00:04:37,009 --> 00:04:40,068
但你終究會領悟的

80
00:04:40,068 --> 00:04:42,178
好吧 這就是我們的迴圈

81
00:04:42,198 --> 00:04:45,228
現在 如果你願意嘗試使用迴圈
可使用 for 迴圈

82
00:04:45,228 --> 00:04:46,660
前提是你想從 for 迴圈開始嘗試

83
00:04:46,660 --> 00:04:52,561
有關 for 迴圈 我們說 
for var friendNum = 0;

84
00:04:52,561 --> 00:04:57,951
然後有
friendNum < myFriends.length 這個條件

85
00:04:57,951 --> 00:05:01,591
然後我們增量：friendNum ++

86
00:05:01,591 --> 00:05:06,772
for 迴圈中 我們可以把剛才那行代碼放在這裡

87
00:05:06,772 --> 00:05:12,662
我只是改變 x 
可以看到 for 迴圈是完全一樣的東西

88
00:05:12,662 --> 00:05:17,094
取決於你使用哪一種迴圈 
重點是 把迴圈用於陣列

89
00:05:17,094 --> 00:05:19,285
因為它會讓你變得很厲害