1
00:00:01,184 --> 00:00:03,425
現在你們已學習到有關
Javascript的基礎知識
2
00:00:03,425 --> 00:00:06,180
我要教你們一個很酷的方式
來使用JavaScript
3
00:00:06,180 --> 00:00:09,555
那就是"物件導向程式設計"
4
00:00:09,555 --> 00:00:12,156
首先我們要理解一下
它為什麼很實用
5
00:00:12,298 --> 00:00:15,858
所以我撰寫了一個程式
讓它變得更”物件導向”後
6
00:00:15,858 --> 00:00:17,218
就會變得更好
7
00:00:17,247 --> 00:00:19,967
這真是一個很酷的程式
8
00:00:19,967 --> 00:00:24,007
在頂部我有兩個變數
裡面儲存了簡單的物件實體語法
9
00:00:24,363 --> 00:00:28,244
物件實體語法是以前
我們所學到的其中一種物件
10
00:00:28,535 --> 00:00:30,634
即是我們構建了兩個大括號
11
00:00:30,634 --> 00:00:33,455
然後把這些屬性名稱
及數值全部放進去
12
00:00:33,762 --> 00:00:37,292
因此我們有兩個物件實體語法變數
13
00:00:37,292 --> 00:00:40,776
在這裡我們有這個函數
drawWinston，它需要一個引數
14
00:00:40,776 --> 00:00:45,115
然後再繪畫出引數
15
00:00:45,115 --> 00:00:47,847
並根據物件的 x及 y 屬性繪畫圖像
16
00:00:47,847 --> 00:00:52,900
然後根據那個物件的暱稱
及年齡屬性添加字幕
17
00:00:52,900 --> 00:00:55,538
最後在底部我們呼叫 drawWinston
18
00:00:55,538 --> 00:00:57,289
到青少年及成人中
19
00:00:57,331 --> 00:01:00,010
這會使它顯示出來
20
00:01:00,862 --> 00:01:05,501
很贊哦。假如我們到這裡
看看這些物件實體語法
21
00:01:05,617 --> 00:01:10,606
就會注意到它們的外觀其實真的很相似
22
00:01:11,188 --> 00:01:15,608
都具有相同系列的屬性
且兩者也可以使用相同的
23
00:01:15,608 --> 00:01:17,493
drawWinston函數
24
00:01:17,891 --> 00:01:21,630
其實如果你們想像一下
他們真的都在描述
25
00:01:21,630 --> 00:01:23,910
某類型的Winston，對不對?
26
00:01:24,240 --> 00:01:28,840
我們可以這樣想 或者在世上
存在著這抽象類型的Winston
27
00:01:28,840 --> 00:01:32,771
而每一 Winston 也具有
相同系列的屬性，如暱稱
28
00:01:32,771 --> 00:01:36,991
年齡、x 與 y
29
00:01:36,991 --> 00:01:42,090
我們剛在這裡完成的是
建立了兩個 Winston實例
30
00:01:42,090 --> 00:01:44,821
來描述特定的 Winston
31
00:01:45,001 --> 00:01:48,350
因此這是青少年Winston
而這是成人Winston
32
00:01:48,350 --> 00:01:52,892
但是，他們兩者真的十分相似
33
00:01:52,892 --> 00:01:55,002
且很多跟他們有關的事也相近
34
00:01:55,002 --> 00:01:57,712
如果你們仔細想想世間上
也有很多不同的運作方式
35
00:01:57,712 --> 00:02:01,341
我們有這些抽象數據類型
如人類及群眾
36
00:02:01,341 --> 00:02:03,714
我們都只是特定的實例
37
00:02:03,714 --> 00:02:05,712
擁有我們自己小小的屬性
38
00:02:06,041 --> 00:02:10,362
現在我們實際上可以使用
物件導向技術 Javascript
39
00:02:10,362 --> 00:02:17,463
使這些 Winston 變數成為
Winston 物件的正式實例
40
00:02:17,921 --> 00:02:21,963
使他們知道正在共享這些共同的東西
41
00:02:21,963 --> 00:02:25,091
要這樣做的話我們需要做的
第一件事就是實際地描述
42
00:02:25,091 --> 00:02:30,372
這個抽象數據類型 Winston
因此我們要作出一個變數
43
00:02:30,372 --> 00:02:35,111
你們要把數據類型儲存在變數
Winston 變數，而我們用大寫W
44
00:02:35,220 --> 00:02:38,630
因為我們的物件類型
通常由大寫字母開始
45
00:02:38,630 --> 00:02:41,810
我們把它設置為函數
46
00:02:41,810 --> 00:02:46,950
而這個函數是一個特定函數
我們把它叫做 "建構子函數"
47
00:02:46,950 --> 00:02:49,471
因為我們每一次要建立
全新的 Winston 實例時
48
00:02:49,471 --> 00:02:52,110
這就是被呼叫的東西
49
00:02:52,110 --> 00:02:55,369
當我們要建立青少年 Winston
就會呼叫這個函數
50
00:02:55,369 --> 00:02:57,989
或要建立成年人 Winston
就會呼叫這個函數
51
00:02:57,997 --> 00:03:03,037
這意味著這個函數要了解
任何需要知道的引數
52
00:03:03,037 --> 00:03:06,267
以作出完整的 Winston
53
00:03:06,457 --> 00:03:10,433
在這種情況下，它需要知道
暱稱、年齡、x 與 y
54
00:03:10,718 --> 00:03:15,249
現在，當我們收到那些引數後
就需要做一些事情
55
00:03:15,249 --> 00:03:20,919
我們需要把這些資料
實際地連接到 Winston 物件
56
00:03:21,389 --> 00:03:26,660
因此我們要使用全新的特別關鍵字"this"
57
00:03:26,660 --> 00:03:29,018
而"this"是指目前的物件實例
58
00:03:29,018 --> 00:03:31,800
我們會說 this.nickname
而它會說”好吧”
59
00:03:31,800 --> 00:03:34,169
而這個物件的暱稱屬性相等於
60
00:03:34,169 --> 00:03:38,030
任何被傳到建構子函數的，好囉?
61
00:03:38,451 --> 00:03:42,381
this.age 相等於傳入的年齡
62
00:03:42,449 --> 00:03:44,138
而 this.x 相等於傳入的 x
63
00:03:44,138 --> 00:03:47,328
而 this.y 相等於傳入的 y
64
00:03:47,466 --> 00:03:52,537
現在我們有這個名為
Winston 的抽象數據類型
65
00:03:52,838 --> 00:03:56,488
而它帶有建構子函數
我們可以使用它來建立全新的Winston
66
00:03:56,488 --> 00:03:58,778
讓我們嘗試使用它吧!
67
00:03:59,476 --> 00:04:03,236
我們要重新建立 WinstonTeen
68
00:04:03,236 --> 00:04:05,314
但是這一次我們用WinstonTeen等於
69
00:04:05,314 --> 00:04:10,365
這裡不用大括號 我們會說
"等於全新的 Winston"
70
00:04:10,607 --> 00:04:14,107
我們會說 "我們正在嘗試
建立全新的 Winston 實例"
71
00:04:14,107 --> 00:04:16,346
然後我們要傳入需要的資料
72
00:04:16,346 --> 00:04:21,478
"Winsteen",15, 20, 50
好囉!
73
00:04:22,246 --> 00:04:26,306
然後我們刪除舊資料
因為已不再需要它們了
74
00:04:26,306 --> 00:04:30,097
好了吧? 現在我們建立了
全新的Winsteen
75
00:04:31,207 --> 00:04:35,806
我們會說
winstonAdult = new Winston()
76
00:04:35,960 --> 00:04:39,502
當然他的名字是"Mr. Winst-a-lot"
聽起來甜美可人的名字
77
00:04:39,502 --> 00:04:45,342
他30歲，在 229 及50
好，然後我們就可以刪除
78
00:04:45,342 --> 00:04:49,923
這個物件實體語法
很好! 我們的代碼仍然正常運作
79
00:04:50,712 --> 00:04:53,651
我們在這裡所做的就是
我們說好吧 就有這個
80
00:04:53,651 --> 00:04:57,161
Winston 抽象類型數據
81
00:04:57,852 --> 00:05:03,073
而我們能建立全新的 Winston 實例
82
00:05:03,073 --> 00:05:05,161
且擁有這些特定的屬性
83
00:05:05,161 --> 00:05:08,661
我們把這些屬性儲存在內
84
00:05:08,661 --> 00:05:12,284
而記憶是非常重要的
因些你們知道內裡
85
00:05:12,284 --> 00:05:14,154
有這個
this.nickname, this.age
86
00:05:14,325 --> 00:05:19,642
如果意外地丟失這個年齡
你們注意到它會說 "未定義"
87
00:05:20,249 --> 00:05:22,958
因為在這裡 drawWinston 函數
88
00:05:22,958 --> 00:05:28,321
期待著任何傳入的物件
都帶有年齡屬性
89
00:05:28,321 --> 00:05:30,803
如果我們沒有 this.age
90
00:05:30,803 --> 00:05:34,372
那麼它也沒有年齡屬性
我們傳入了建構子函數
91
00:05:34,372 --> 00:05:37,231
但是並沒有用它做任何事情
92
00:05:37,231 --> 00:05:39,452
我們必須使用 "this"關鍵字
實際地連接到物件
93
00:05:39,621 --> 00:05:41,542
那我們就把它添加回去
94
00:05:41,542 --> 00:05:45,111
現在你們會想代碼已正常運作
95
00:05:45,111 --> 00:05:50,321
但是......我們只是完成了前面做過的事
96
00:05:50,457 --> 00:05:53,936
但這裡是一件很酷的事
我們所有的 Winstons
97
00:05:53,936 --> 00:05:56,086
經過相同的建構子函數
98
00:05:56,086 --> 00:05:59,656
如果我們想要進行更新
我們是真的可以修改它們的
99
00:05:59,656 --> 00:06:01,167
有關 Winston 的一些東西...
100
00:06:01,167 --> 00:06:04,217
所有的 Winstons
就在這裡，可能是年齡
101
00:06:04,217 --> 00:06:06,107
事實上我們想說 "歲數"
102
00:06:06,107 --> 00:06:09,838
我們只須放在這裡
現在所有 Winstons 說
103
00:06:09,838 --> 00:06:12,879
"15歲"、 "30歲" 對嗎?
104
00:06:12,879 --> 00:06:14,977
因此他們只取用獨特的部分
105
00:06:14,977 --> 00:06:17,417
他們也有共享的東西
106
00:06:17,417 --> 00:06:20,107
而物件導向程式設計最棒的地方
107
00:06:20,107 --> 00:06:22,107
就是在這世上有這類的物件
108
00:06:22,107 --> 00:06:26,108
你們能夠實際地建立這些物件的實例
109
00:06:26,108 --> 00:06:28,428
而還有跟他們相似的東西
110
00:06:28,428 --> 00:06:30,408
例如他們擁有相同的屬性
111
00:06:30,408 --> 00:06:32,409
且有不同的東西
112
00:06:32,409 --> 00:06:35,508
例如這個屬性事實上跟其他的屬性
帶有不同的數值，對不對?
113
00:06:35,508 --> 00:06:38,748
你們知道嘛，我們可以
使用相同的行為
114
00:06:38,748 --> 00:06:40,508
像呼叫相同的函數
115
00:06:40,508 --> 00:06:43,069
以類似的方式使用它們
116
00:06:43,069 --> 00:06:45,979
這是一些有關物件導向
程式設計很棒的東西
117
00:06:45,979 --> 00:06:48,548
而你們將會看到更多很棒的東西
118
00:06:48,548 --> 00:06:50,148
敬請繼續收看