WEBVTT

00:00:00.780 --> 00:00:06.234
Trong bài hướng dẫn lần trước, ta đã tìm hiểu cách tạo một loại đối tượng để thể hiện hai đối tượng giống với Winston

00:00:06.234 --> 00:00:09.234
rồi khởi chạy bằng hàm tạo.

00:00:09.234 --> 00:00:13.472
Bây giờ, một loại đối tượng không chỉ liên kết với thuộc tính.

00:00:13.472 --> 00:00:18.806
Nó còn có thể liên kết với chức năng. Hãy nghĩ về thế giới này và coi tất cả những loại chức năng trong đó

00:00:18.806 --> 00:00:26.287
như con người. Ai cũng có cân nặng và tuổi tác, nhưng ta cũng có khả năng làm những thứ như ngủ, ăn, và lập trình.

00:00:26.287 --> 00:00:30.939
Và ta muốn liên kết các hàm này với những loại đối tượng đó.

00:00:30.939 --> 00:00:35.949
Trong chương trình này, cũng là chương trình mà ta đã làm việc từ lần trước, ta có một hàm,

00:00:35.949 --> 00:00:43.066
drawWinston, mà ta gọi cho cả hai đối tượng Winston. Nếu ta có thể liên kết với loại đối tượng Winston

00:00:43.066 --> 00:00:48.569
thì sẽ gọn gàng hơn đấy nhỉ? Hoàn toàn có thể đấy, và rất đơn giản.

00:00:48.569 --> 00:00:55.725
Phía dưới hàm tạo, ta sẽ viết Winston – W viết hoa – chấm prototype,

00:00:55.725 --> 00:00:59.232
và prototype đó, là từ mới mà chắc các bạn chưa từng nhìn thấy.

00:00:59.232 --> 00:01:05.881
Prototype là một thuộc tính của đối tượng giúp ta có thể liên kết hàm

00:01:05.881 --> 00:01:13.309
và điều đó có nghĩa là mọi đối tượng đóng vai trò instance sẽ liên kết với những hàm này.

00:01:13.309 --> 00:01:19.612
Ta có thể nhập .prototype rồi chấm, tiếp đến tên hàm, như vậy ta nhập draw,

00:01:19.612 --> 00:01:25.606
bằng, sau đó ta có thể lấy hàm drawWinston và

00:01:25.606 --> 00:01:32.951
đưa vào trong đây. Được rồi vậy là ta đã liên kết một hàm draw

00:01:32.951 --> 00:01:40.008
với prototype Winston. Điều đó có nghĩa là ta có thể gọi draw() trên bất cứ đối tượng Winston nào.

00:01:40.008 --> 00:01:45.411
Được rồi, như vậy ta có thể gọi draw() trên winstonTeen hoặc winstonAdult.

00:01:45.411 --> 00:01:49.569
Và khi đã có một hàm có khả năng gọi đối tượng như này,

00:01:49.569 --> 00:01:54.833
ta gọi đó là “thủ tục”, hẳn các bạn đã từng nghe đến “thủ tục” rồi.

00:01:54.833 --> 00:01:58.272
Vậy ta gọi đây là “thủ tục draw” đi. Được rồi.

00:01:58.272 --> 00:02:04.103
Bây giờ ta sẽ xóa cái này, xóa cái này, và ta sẽ xem có gọi draw() được không.

00:02:04.103 --> 00:02:07.069
winstonTeen.draw()

00:02:07.069 --> 00:02:13.697
OK. Ở góc này có một thông báo lỗi, nội dung là “winstObject is not defined”.

00:02:13.697 --> 00:02:20.530
Được rồi. Vậy, trước đó ta đã đưa đối số này vào drawWinston, tức đối tượng Winston

00:02:20.530 --> 00:02:26.462
nhưng hiện tại ta không đưa vào nữa. Vì thế, ta có thể thay đổi cái này để đưa vào

00:02:26.462 --> 00:02:30.819
và, ta sẽ nhập gì nhỉ? Ta sẽ phải đưa vào winstonTeen. Ok.

00:02:30.819 --> 00:02:38.441
Thành công rồi, nhưng nhìn buồn cười quá. Tôi đã gọi hàm draw cho đối tượng rồi.

00:02:38.441 --> 00:02:43.965
Đáng lẽ tôi không nên đưa cả đối tượng vào. Như vậy thừa quá.

00:02:43.965 --> 00:02:48.465
Đúng vậy, đáng lẽ tôi không nên làm thế, vậy thì xóa thôi, bây giờ ta thử nghĩ nhé.

00:02:48.465 --> 00:02:54.404
Nếu ta ở bên trong đối tượng, ta có thể sử dụng gì để tiếp cận thuộc tính của đối tượng?

00:02:54.404 --> 00:03:00.374
Các bạn có thể nhìn vào hàm tạo, nhớ lại từ khóa đặc biệt “this” và thốt lên “à à”.

00:03:00.374 --> 00:03:08.573
“Vậy nếu ta đổi cái này, thành cái này thì sao!” [cười] Như vậy ta đổi winstObject thành “this”.

00:03:08.573 --> 00:03:12.951
Vì hiện tại ta đang ở bên trong đối tượng. Hàm này đang được đánh giá

00:03:12.951 --> 00:03:16.861
trên đối tượng, vì vậy “this” sẽ tham chiếu tới đối tượng hiện tại.

00:03:16.861 --> 00:03:23.271
Với cách đó ta chỉ cần nhập “this” và ta có thể tiếp cận tất cả mọi thuộc tính của đối tượng hiện tại.

00:03:23.271 --> 00:03:26.720
Thấy chứ, ta thành công rồi. Thật thú vị phải không?

00:03:26.720 --> 00:03:31.907
Sau đó ta có thể nhập winstonAdult.draw()

00:03:31.907 --> 00:03:38.271
Tada! Và nó sẽ tiếp cận tới các thuộc tính của winstonAdult vì đó là đối tượng đang được gọi.

00:03:38.271 --> 00:03:45.752
Đó là cái hay của từ khóa “this” này, mặc dù đôi khi hơi khó hiểu một chút.

00:03:45.752 --> 00:03:52.028
Được rồi, vui thế đủ rồi, ta cùng thêm một thủ tục khác nhé. OK, Winston có thể làm gì nữa?

00:03:52.028 --> 00:04:01.078
Cậu ta có thể nói chuyện chẳng hạn. Như vậy ta sẽ tạo Winston.prototype.talk, và ta có thể liên kết tới prototype bao nhiêu thủ tục cũng được.

00:04:01.078 --> 00:04:05.241
Ta sẽ nhập “I’m Winston!”

00:04:05.241 --> 00:04:13.181
Sau đó ta nhập this.s+20, và this.y+150.

00:04:13.181 --> 00:04:19.733
Rồi, các bạn biết đấy, chẳng có gì xảy ra cả, nhưng tất nhiên đó là bởi tôi vẫn chưa gọi hàm.

00:04:19.733 --> 00:04:25.068
Vậy cho phiên bản thiếu niên nói chuyện đi, winstonTeen.talk(). Các bạn tuổi teen nói chuyện liên mồm ấy.

00:04:25.068 --> 00:04:30.479
I’m Winston, tada! Tiếp theo là winstonAdilt.talk().

00:04:30.479 --> 00:04:36.828
Tada! Được rồi, hiện tại ta có loại đối tượng Winston mang các thuộc tính: nickname,

00:04:36.828 --> 00:04:45.026
age, x, y; và có chức năng: behaviors, methods; đóng các vai trò khác nhau tùy theo thuộc tính.

00:04:45.026 --> 00:04:50.999
Và ta có thể tạo bao nhiêu instance của Winston và gọi bất cừ thủ tục nào tùy thích.

00:04:50.999 --> 00:00:00.000
Thật hay ho phải không?