WEBVTT

00:00:01.056 --> 00:00:04.067
讓我們繼續探索，我們還能利用物件做什麼。

00:00:04.067 --> 00:00:07.779
我們回到程式設計裡使用函數的教程。

00:00:08.339 --> 00:00:11.839
這程式有「繪製溫斯頓」的函數，
它知道如何繪製溫斯頓，

00:00:11.839 --> 00:00:14.588
於所指定的 X 和 Y 座標。

00:00:14.678 --> 00:00:18.128
在這裡，我們呼叫「繪製溫斯頓」四次。

00:00:18.128 --> 00:00:21.043
每次以不同組合的 X 和 Y 坐標。

00:00:21.504 --> 00:00:25.889
當我看到這四組「繪製溫斯頓」的呼叫程式，

00:00:25.911 --> 00:00:31.030
是如此相似時，我就想到更方便的方式是，

00:00:31.030 --> 00:00:35.802
如果我們能使用一個循環圈，
然後在循環圈裡只叫它一次，

00:00:35.802 --> 00:00:39.541
改變這 X 和 Y 每次循環迭代裡的座標。

00:00:39.861 --> 00:00:44.361
要做到這個，我們需要找到
一種方法來儲存這些 X 和 Y 位置，

00:00:44.361 --> 00:00:47.671
如此才能於一個陣列裡循環它。

00:00:47.671 --> 00:00:51.932
目前有兩組的值，所以我們可以有兩個陣列，

00:00:51.932 --> 00:00:56.030
一個給 X 的座標和一個給 Y 的座標。

00:00:56.030 --> 00:01:01.262
X 的座標可能是 99、
294、101、和 294。

00:01:02.281 --> 00:01:08.812
而 Y 的座標我們會有
117，117，316、316。

00:01:09.564 --> 00:01:14.472
好了，現在我們可以循環那些
有著我們循環變數 i = 0；

00:01:14.472 --> 00:01:18.672
i < x 位置點長度； i++。

00:01:18.672 --> 00:01:22.302
如此，我們會按序循環每個
在 x 位置的元素，我們會編寫：

00:01:22.302 --> 00:01:29.382
「繪製溫斯頓（x 位置 [i]，
y 位置 [i]）」；

00:01:30.703 --> 00:01:34.564
好，讓我們來看看利用刪除是否可行...

00:01:34.564 --> 00:01:36.172
好棒，那是可行的。

00:01:36.172 --> 00:01:40.812
現在我們只要呼叫這個，只用這行代碼，
來編輯「繪製溫斯頓」

00:01:40.812 --> 00:01:43.291
但它就會寫在每個

00:01:43.291 --> 00:01:45.412
「x 位置」陣列的位置裡。

00:01:45.412 --> 00:01:49.057
我們可以在這裡添加更多的值，例如 10，

00:01:49.057 --> 00:01:57.816
那麼我們加 1，然後 1，
然後 1，然後 100，然後 1。

00:01:58.482 --> 00:02:03.106
現在它看起來稍微有點亂。我不喜歡這樣，

00:02:03.106 --> 00:02:08.057
因為這樣很難看得出來哪些 X 與哪些 Y 相關聯。

00:02:11.018 --> 00:02:14.759
我要能一眼就看清楚 X 和 Y 的配對組合。

00:02:14.759 --> 00:02:19.798
而不必確保我有完美地上下對齊它們，

00:02:19.798 --> 00:02:21.089
例如，像是這樣。

00:02:22.309 --> 00:02:26.979
所以，我要找出不同的方式來儲存的這些位置。

00:02:26.979 --> 00:02:30.759
一個做法是，我們可以將它們儲存為物件。

00:02:30.760 --> 00:02:34.969
想想看，每個位置都有兩位信息：

00:02:34.969 --> 00:02:39.808
就是 X 和 Y。所以，我們可以有
一個具有 X 和 Y 屬性的物件，

00:02:39.808 --> 00:02:44.758
然後我們有一個包含所有 
X 和 Y 位置的陣列物件。

00:02:44.758 --> 00:02:45.958
讓我們就這麼做。

00:02:45.958 --> 00:02:51.129
將變數位置相等於陣列。

00:02:51.129 --> 00:02:56.110
但是，每個元素並不是一個號碼，
而是一個物件。

00:02:56.365 --> 00:03:00.329
我們有了我們的大括號，然後我們說，

00:03:00.329 --> 00:03:05.240
X: 99，Y: 117。

00:03:05.319 --> 00:03:08.921
好，我們現在有了其中一個位置在這裡。

00:03:08.921 --> 00:03:14.000
然後在這裡我們再添加一個。

00:03:14.570 --> 00:03:19.071
X 應該是 294，117，

00:03:19.071 --> 00:03:24.271
第三個會是 101，316，

00:03:25.481 --> 00:03:31.339
然後最後一個是294和316。

00:03:31.671 --> 00:03:34.881
好，現在我們有了一個陣列物件，

00:03:34.881 --> 00:03:38.280
而且每個物件都有，
X 和 Y 的屬性在裡面。

00:03:38.470 --> 00:03:44.712
在我們的循環圈裡，我們將更改
它通過「位置點長度」的迭代。

00:03:44.712 --> 00:03:49.261
然後，我們會傳遞物件。

00:03:49.261 --> 00:03:54.008
現在它正傳遞所有的物件，
但我們想要傳遞 X 和 Y，

00:03:54.008 --> 00:03:59.098
所以我們需要
位置 [i] 點 x 和位置 [i] 點 y。

00:03:59.195 --> 00:04:00.692
成功！

00:04:00.692 --> 00:04:04.201
現在，我們可以刪除這些舊的陣列集群。

00:04:04.563 --> 00:04:09.725
太好了，這樣看起來就整齊多了，
代碼更容易閱讀。

00:04:09.725 --> 00:04:12.928
不論何時，只要有容易閱讀的代碼
都是較好的。

00:04:13.178 --> 00:04:16.740
這樣也會更容易做添加。
所以，如果我要再添加一個，

00:04:16.740 --> 00:04:23.450
我只需同時添加一對，
我們可以說 X 是 200，Y 是 200，

00:04:23.450 --> 00:04:25.672
中間在放一個小溫斯頓。

00:04:26.539 --> 00:04:27.597
很酷。

00:04:27.930 --> 00:04:31.299
現在，我要教你一些比這個更炫的東西。

00:04:31.811 --> 00:04:36.761
請注意，我們的函數目前接受兩個位數，

00:04:37.221 --> 00:04:39.150
然後使用這兩個數字。

00:04:39.150 --> 00:04:42.160
我們可以更改我們的函數，
讓它期待一個物件，

00:04:42.160 --> 00:04:45.261
然後它在從該物件裡取得 X 和 Y。

00:04:45.261 --> 00:04:49.572
這意味著，在這裡我們可以只傳遞物件。

00:04:49.741 --> 00:04:51.169
讓我們來試試。

00:04:51.169 --> 00:04:54.071
我們傳遞了物件，現在就壞了。

00:04:54.071 --> 00:04:57.680
那是因為我們的函數，仍然是期待兩個物件，

00:04:57.680 --> 00:05:00.526
而它只獲得一個。所以我們將它更改為

00:05:00.526 --> 00:05:05.281
它將獲得「臉位置」。
現在，我們接到了一個錯誤訊息，

00:05:05.281 --> 00:05:10.002
它表示「臉X」未被定義。
那是因為之前我們是以論據在傳遞「臉X」，

00:05:10.002 --> 00:05:12.933
但目前它並不存在，我們只會得到一個物件。

00:05:12.933 --> 00:05:19.501
所以，我們要做的，就是將物件裡X的位置，

00:05:19.501 --> 00:05:21.264
儲存在「臉X」的變數裡。

00:05:21.264 --> 00:05:24.952
我們有這個物件，
我們知道這個物件裡有一個X屬性，

00:05:24.952 --> 00:05:28.463
所以我們只要將它存儲在「臉X」的變數裡。

00:05:28.463 --> 00:05:33.762
我們可以對 Y 做同樣的事情，
這樣「臉 Y 等於臉位置點 y」。

00:05:33.762 --> 00:05:35.069
成功！

00:05:35.069 --> 00:05:38.307
你也知道，其餘的那些函數
會使用「臉X」和「臉Y」。

00:05:38.307 --> 00:05:39.972
我們必須確保拼寫的正確性，

00:05:39.972 --> 00:05:42.059
如果寫的是 xx,，就會無效。

00:05:42.059 --> 00:05:48.153
因為那與我們陣列物件裡的並不一致。
所以它需要能相配。

00:05:48.661 --> 00:05:52.013
這樣就滿整齊的。現在你可以有陣列物件，

00:05:52.013 --> 00:05:54.420
你可以有附帶物件的函數。

00:05:54.420 --> 00:05:58.342
你會發現你的程式，變的非常強大，

00:05:58.342 --> 00:06:00.780
因為它們數據的構建方式。

00:06:00.780 --> 00:06:04.192
特別是因為它常常將 X 和 Y 配對。

00:06:04.192 --> 00:06:05.460
我想你會發現，

00:06:05.460 --> 00:06:09.292
它們在這兒的繪製及動畫程式裡，特別好用。

00:06:09.292 --> 00:06:11.461
所以，快試試吧！
祝你玩得開心！