陣列的物件程式設計（視頻版）
-
0:01 - 0:04讓我們繼續探索，我們還能利用物件做什麼。
-
0:04 - 0:08我們回到程式設計裡使用函數的教程。
-
0:08 - 0:12這程式有「繪製溫斯頓」的函數，
它知道如何繪製溫斯頓， -
0:12 - 0:15於所指定的 X 和 Y 座標。
-
0:15 - 0:18在這裡，我們呼叫「繪製溫斯頓」四次。
-
0:18 - 0:21每次以不同組合的 X 和 Y 坐標。
-
0:22 - 0:26當我看到這四組「繪製溫斯頓」的呼叫程式，
-
0:26 - 0:31是如此相似時，我就想到更方便的方式是，
-
0:31 - 0:36如果我們能使用一個循環圈，
然後在循環圈裡只叫它一次， -
0:36 - 0:40改變這 X 和 Y 每次循環迭代裡的座標。
-
0:40 - 0:44要做到這個，我們需要找到
一種方法來儲存這些 X 和 Y 位置， -
0:44 - 0:48如此才能於一個陣列裡循環它。
-
0:48 - 0:52目前有兩組的值，所以我們可以有兩個陣列，
-
0:52 - 0:56一個給 X 的座標和一個給 Y 的座標。
-
0:56 - 1:01X 的座標可能是 99、
294、101、和 294。 -
1:02 - 1:09而 Y 的座標我們會有
117，117，316、316。 -
1:10 - 1:14好了，現在我們可以循環那些
有著我們循環變數 i = 0； -
1:14 - 1:19i < x 位置點長度； i++。
-
1:19 - 1:22如此，我們會按序循環每個
在 x 位置的元素，我們會編寫： -
1:22 - 1:29「繪製溫斯頓（x 位置 [i]，
y 位置 [i]）」； -
1:31 - 1:35好，讓我們來看看利用刪除是否可行...
-
1:35 - 1:36好棒，那是可行的。
-
1:36 - 1:41現在我們只要呼叫這個，只用這行代碼，
來編輯「繪製溫斯頓」 -
1:41 - 1:43但它就會寫在每個
-
1:43 - 1:45「x 位置」陣列的位置裡。
-
1:45 - 1:49我們可以在這裡添加更多的值，例如 10，
-
1:49 - 1:58那麼我們加 1，然後 1，
然後 1，然後 100，然後 1。 -
1:58 - 2:03現在它看起來稍微有點亂。我不喜歡這樣，
-
2:03 - 2:08因為這樣很難看得出來哪些 X 與哪些 Y 相關聯。
-
2:11 - 2:15我要能一眼就看清楚 X 和 Y 的配對組合。
-
2:15 - 2:20而不必確保我有完美地上下對齊它們，
-
2:20 - 2:21例如，像是這樣。
-
2:22 - 2:27所以，我要找出不同的方式來儲存的這些位置。
-
2:27 - 2:31一個做法是，我們可以將它們儲存為物件。
-
2:31 - 2:35想想看，每個位置都有兩位信息：
-
2:35 - 2:40就是 X 和 Y。所以，我們可以有
一個具有 X 和 Y 屬性的物件， -
2:40 - 2:45然後我們有一個包含所有
X 和 Y 位置的陣列物件。 -
2:45 - 2:46讓我們就這麼做。
-
2:46 - 2:51將變數位置相等於陣列。
-
2:51 - 2:56但是，每個元素並不是一個號碼，
而是一個物件。 -
2:56 - 3:00我們有了我們的大括號，然後我們說，
-
3:00 - 3:05X: 99，Y: 117。
-
3:05 - 3:09好，我們現在有了其中一個位置在這裡。
-
3:09 - 3:14然後在這裡我們再添加一個。
-
3:15 - 3:19X 應該是 294，117，
-
3:19 - 3:24第三個會是 101，316，
-
3:25 - 3:31然後最後一個是294和316。
-
3:32 - 3:35好，現在我們有了一個陣列物件，
-
3:35 - 3:38而且每個物件都有，
X 和 Y 的屬性在裡面。 -
3:38 - 3:45在我們的循環圈裡，我們將更改
它通過「位置點長度」的迭代。 -
3:45 - 3:49然後，我們會傳遞物件。
-
3:49 - 3:54現在它正傳遞所有的物件，
但我們想要傳遞 X 和 Y， -
3:54 - 3:59所以我們需要
位置 [i] 點 x 和位置 [i] 點 y。 -
3:59 - 4:01成功！
-
4:01 - 4:04現在，我們可以刪除這些舊的陣列集群。
-
4:05 - 4:10太好了，這樣看起來就整齊多了，
代碼更容易閱讀。 -
4:10 - 4:13不論何時，只要有容易閱讀的代碼
都是較好的。 -
4:13 - 4:17這樣也會更容易做添加。
所以，如果我要再添加一個， -
4:17 - 4:23我只需同時添加一對，
我們可以說 X 是 200，Y 是 200， -
4:23 - 4:26中間在放一個小溫斯頓。
-
4:27 - 4:28很酷。
-
4:28 - 4:31現在，我要教你一些比這個更炫的東西。
-
4:32 - 4:37請注意，我們的函數目前接受兩個位數，
-
4:37 - 4:39然後使用這兩個數字。
-
4:39 - 4:42我們可以更改我們的函數，
讓它期待一個物件， -
4:42 - 4:45然後它在從該物件裡取得 X 和 Y。
-
4:45 - 4:50這意味著，在這裡我們可以只傳遞物件。
-
4:50 - 4:51讓我們來試試。
-
4:51 - 4:54我們傳遞了物件，現在就壞了。
-
4:54 - 4:58那是因為我們的函數，仍然是期待兩個物件，
-
4:58 - 5:01而它只獲得一個。所以我們將它更改為
-
5:01 - 5:05它將獲得「臉位置」。
現在，我們接到了一個錯誤訊息， -
5:05 - 5:10它表示「臉X」未被定義。
那是因為之前我們是以論據在傳遞「臉X」， -
5:10 - 5:13但目前它並不存在，我們只會得到一個物件。
-
5:13 - 5:20所以，我們要做的，就是將物件裡X的位置，
-
5:20 - 5:21儲存在「臉X」的變數裡。
-
5:21 - 5:25我們有這個物件，
我們知道這個物件裡有一個X屬性， -
5:25 - 5:28所以我們只要將它存儲在「臉X」的變數裡。
-
5:28 - 5:34我們可以對 Y 做同樣的事情，
這樣「臉 Y 等於臉位置點 y」。 -
5:34 - 5:35成功！
-
5:35 - 5:38你也知道，其餘的那些函數
會使用「臉X」和「臉Y」。 -
5:38 - 5:40我們必須確保拼寫的正確性，
-
5:40 - 5:42如果寫的是 xx,，就會無效。
-
5:42 - 5:48因為那與我們陣列物件裡的並不一致。
所以它需要能相配。 -
5:49 - 5:52這樣就滿整齊的。現在你可以有陣列物件，
-
5:52 - 5:54你可以有附帶物件的函數。
-
5:54 - 5:58你會發現你的程式，變的非常強大，
-
5:58 - 6:01因為它們數據的構建方式。
-
6:01 - 6:04特別是因為它常常將 X 和 Y 配對。
-
6:04 - 6:05我想你會發現，
-
6:05 - 6:09它們在這兒的繪製及動畫程式裡，特別好用。
-
6:09 - 6:11所以，快試試吧！
祝你玩得開心！
|
Ching-Yi Lai approved Chinese, Traditional subtitles for Arrays of Objects (Video Version) | |
|
|
Ching-Yi Lai edited Chinese, Traditional subtitles for Arrays of Objects (Video Version) | |
|
|
Ching-Yi Lai edited Chinese, Traditional subtitles for Arrays of Objects (Video Version) | |
|
|
Ching-Yi Lai edited Chinese, Traditional subtitles for Arrays of Objects (Video Version) | |
|
|
Ching-Yi Lai edited Chinese, Traditional subtitles for Arrays of Objects (Video Version) | |
|
|
Ching-Yi Lai edited Chinese, Traditional subtitles for Arrays of Objects (Video Version) | |
|
|
Ching-Yi Lai edited Chinese, Traditional subtitles for Arrays of Objects (Video Version) | |
|
Deborah Lu edited Chinese, Traditional subtitles for Arrays of Objects (Video Version) |