Return to Video

陣列迴圈(視頻版)

  • 0:01 - 0:04
    我們回到那顯示我的陣列 (array) 朋友的程式
  • 0:04 - 0:07
    但是有一些事真的惹惱了我
  • 0:07 - 0:09
    每次我添加一個新朋友到陣列中 都要補充
  • 0:09 - 0:11
    一個新的文字命令 (text command) 到這裡
  • 0:11 - 0:13
    假設我加了溫斯頓
  • 0:13 - 0:15
    他不會自動顯示出來
  • 0:15 - 0:20
    如果我要他露面 我得說
    text(myFriends[3],
  • 0:20 - 0:23
    然後更改位置 y
    才可以看到溫斯頓
  • 0:23 - 0:25
    這實在是很麻煩
  • 0:25 - 0:28
    我希望每次加入別人到陣列時
    他都會自動顯示出來
  • 0:28 - 0:31
    程式會自動做那個文字命令
  • 0:31 - 0:34
    好了 還記得我們學過迴圈嗎?
  • 0:34 - 0:39
    迴圈是個偉大的方式
    可以多次重複相同的代碼
  • 0:39 - 0:43
    就像 如果我們想要有連續的一堆樹木
    或一串氣球
  • 0:43 - 0:50
    事實證明 迴圈也是陣列的元素上運行代碼中
    很棒的方式
  • 0:50 - 0:54
    事實上 每次使用陣列時 你幾乎都會用到迴圈
  • 0:54 - 0:57
    他們一起工作真的很配
  • 0:57 - 1:00
    為了讓你明白我的意思
    我不用文字命令
  • 1:00 - 1:04
    而是用一個迴圈
    來顯示我朋友名字
  • 1:04 - 1:08
    我們將從三個問題開始
    當我們做迴圈時 總是會問自己
  • 1:08 - 1:11
    首先 我想重複的是什麼?
    看過內容後,什麼是重複的?
  • 1:11 - 1:13
    就是文字命令 (text command)
  • 1:13 - 1:17
    我每次想改變什麼?
    就讓我看看有什麼不同
  • 1:17 - 1:20
    位置 y 和當前的索引指數 (index) ,是吧?
  • 1:20 - 1:26
    就是 NUM 這位朋友和位置 y
  • 1:26 - 1:28
    那我們應該重複多久?
  • 1:28 - 1:33
    繼續下去 直到沒有其它朋友
  • 1:33 - 1:37
    好 現在我們知道想要什麼
    可以做個迴圈
  • 1:37 - 1:41
    我們從計數器變量 (counter variable)
    開始追蹤迴圈位置
  • 1:41 - 1:44
    所以我們說 var friendNum = 0;
  • 1:44 - 1:49
    計數從零開始
    因為 0 是陣列中的第一個元素
  • 1:49 - 1:51
    1 不是第一個元素
  • 1:51 - 1:58
    我們有 while 迴圈 所以我們說
    while(friendNum < my friends.length)
  • 1:58 - 2:04
    現在我們要比較
    當下計數器變量與陣列中元素的總數
  • 2:04 - 2:07
    迴圈中 這裡是使用文字命令處
  • 2:07 - 2:09
    我們說 text(myFriends[
  • 2:09 - 2:15
    而這裡我們放 friendNum 不放數字
    因為 friendNum 代表當前的數量
  • 2:15 - 2:18
    我們目前為止只放一個位置 y
  • 2:18 - 2:22
    OK 這給了我們一個無限迴圈的錯誤
  • 2:22 - 2:26
    因為我們還沒有改變 friendNum
  • 2:26 - 2:28
    請記住 每次迴圈都需要遞增 friendNum
  • 2:28 - 2:33
    否則條件為真 迴圈會永遠繼續下去
  • 2:33 - 2:38
    我看到某些事情發生了
    讓我註釋掉舊代碼 看看發生了什麼事
  • 2:38 - 2:44
    我們想現出所有的名字 但是他們都被蓋掉了
  • 2:44 - 2:45
    因此 我們需要改變位置 y
  • 2:45 - 2:50
    讓我們就說 'friendNum*30'
  • 2:50 - 2:52
    這很好 但索菲亞關閉銀幕
  • 2:52 - 2:55
    索菲亞如果發現了這一點 她會很不高興
  • 2:55 - 3:00
    那就讓我們加 30
    現在全部都差距 30
  • 3:00 - 3:04
    好棒!現在你看 我們有顯示陣列的迴圈
  • 3:04 - 3:09
    這意味著如果我們增加更多的人
    像是蓋伊 或者是薩爾 Sal
  • 3:09 - 3:12
    如果我只加 薩爾 Sal 到陣列
    薩爾他會成為我的朋友
  • 3:12 - 3:14
    真棒!現在 他是我哥們了
  • 3:14 - 3:18
    呃... 你可以看到 新朋友是自動顯示
  • 3:18 - 3:21
    因為它始終排在陣列裡
  • 3:21 - 3:24
    我們可以刪除舊代碼
    因為不再需要它
  • 3:24 - 3:29
    我們檢視整個代碼 並查看它是在做什麼
  • 3:29 - 3:31
    我們從 friendNum 等於零開始
  • 3:31 - 3:34
    我們檢查看看 friendNum 是否小於當前長度
  • 3:34 - 3:38
    你可以想像 0 比 6 小 確實如此
  • 3:38 - 3:42
    於是 我們從這裡進去
    我們說 我的朋友 friendNum
  • 3:42 - 3:45
    所以這將是我的第零個朋友 第一次
  • 3:45 - 3:48
    然後 30 加上 0 乘以 30
  • 3:48 - 3:54
    它顯示索菲亞在位置 10 和 30 上
    就是這樣的
  • 3:54 - 3:57
    然後用 friendNum ++
    於是 friendNum 就變成 1
  • 3:57 - 3:59
    然後它返回說:
    1 比 myfriends.length 的長度小嗎?
  • 3:59 - 4:00
    是啊 沒錯
  • 4:00 - 4:02
    迴圈這樣一直保持下去...
  • 4:02 - 4:07
    最後我們來到薩爾
    記住 薩爾在陣列中其實是第六元素
  • 4:07 - 4:11
    但他的索引指數 (index) 是 5
    因為指數從零開始
  • 4:11 - 4:14
    那麼 5 比 6 小?是
  • 4:14 - 4:16
    因此 顯示 myfriends 等於 5
  • 4:16 - 4:20
    然後 它變成 6
    我們問 6 比 6 小嗎?
  • 4:20 - 4:23
    錯! 6 等於 6
    因此這是錯誤的
  • 4:23 - 4:26
    因此 它永遠不會顯示第六個元素
  • 4:26 - 4:30
    這很好 因為指數 6 沒有任何人
  • 4:30 - 4:33
    有第六元素 但沒有人在指數六
  • 4:33 - 4:37
    這可能令人混淆 他是 0 也是 1
  • 4:37 - 4:40
    但你終究會領悟的
  • 4:40 - 4:42
    好吧 這就是我們的迴圈
  • 4:42 - 4:45
    現在 如果你願意嘗試使用迴圈
    可使用 for 迴圈
  • 4:45 - 4:47
    前提是你想從 for 迴圈開始嘗試
  • 4:47 - 4:53
    有關 for 迴圈 我們說
    for var friendNum = 0;
  • 4:53 - 4:58
    然後有
    friendNum < myFriends.length 這個條件
  • 4:58 - 5:02
    然後我們增量:friendNum ++
  • 5:02 - 5:07
    for 迴圈中 我們可以把剛才那行代碼放在這裡
  • 5:07 - 5:13
    我只是改變 x
    可以看到 for 迴圈是完全一樣的東西
  • 5:13 - 5:17
    取決於你使用哪一種迴圈
    重點是 把迴圈用於陣列
  • 5:17 - 5:19
    因為它會讓你變得很厲害
Title:
陣列迴圈(視頻版)
Description:

這僅是我們的互動編碼充分談話的銀幕截屏,讓製做字幕和翻譯更容易。更好的談話內容可在這裡觀看:
https://www.khanacademy.org/cs/programming/

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

Chinese, Traditional subtitles

Revisions