-
Chúng ta cùng tiếp tục khám phá
-
công dụng của đối tượng.
-
Ta sẽ quay lại với chương trình đã sử dụng
-
trong bài hướng dẫn về các hàm.
-
Chương trình này chứa hàm drawWinston
-
có khả năng vẽ Winston,
-
và chứa một cặp x và y nhất định.
-
Ở dưới đây, ta gọi hàm drawWinston 4 lần.
-
Mỗi lần gọi với một cặp tọa độ x và y khác nhau.
-
Các bạn biết tôi mà.
-
Khi tôi nhìn vào 4 lần gọi drawWinston
-
gần giống hệt nhau này,
-
tất cả những gì tôi có thể nghĩ ra là sẽ tốt hơn bao nhiêu
-
nếu ta sử dụng vòng lặp
-
và chỉ cần gọi một lần trong vòng lặp,
-
thay đổi x và y cho mỗi lần lặp.
-
Để làm được điều đó, ta phải tìm cách
-
lưu trữ các tọa độ x và y này trong một mảng
-
để có thể lặp được.
-
Vậy với bộ giá trị này,
-
ta có thể tạo 2 mảng:
-
một mảng cho x, và một mảng cho y.
-
Như vậy xPostitions, ta có thể có 99, 294,
-
101, và 294.
-
Còn yPositions, ta sẽ có 117, 117,
-
316, 316.
-
Được rồi, bây giờ ta có thể lặp qua những tọa độ đó
-
với vòng lặp for, var i = 0,
-
i < xPositions.length, i++.
-
Như vậy ta sẽ lặp qua từng phần tử trong xPositions,
-
và ta nhập drawWinston,
-
xPositions[i]s,
-
và yPositions[i].
-
Được rồi.
-
Ta thử xóa xem có được không nhé.
-
Vậy là được rồi.
-
Bây giờ ta có thể gọi được,
-
chỉ với một dòng mã
-
chạy hàm drawWinston, nhưng mỗi lần chạy
-
với một vị trí khác nhau trong mảng xPositions.
-
Ta có thể tiếp tục thêm vào
-
bằng cách nhập 10 rồi cộng thêm 1,
-
rồi lại cộng thêm 1 và cộng thêm 1,
-
sau đó là 100 và 1.
-
Trông bắt đầu lộn xộn rồi,
-
tôi chẳng thích tí nào vì rất khó có thể
-
thấy x nào liên quan tới y nào.
-
Tôi muốn chỉ cần liếc qua
-
cũng biết mình đang nhìn vào cặp x, y nào.
-
Thay vì phải đảm bảo
-
sắp xếp chúng một cách hoàn hảo
-
như thế này.
-
Tôi muốn tìm cách khác để lưu trữ những tọa độ này.
-
Ta có thể lưu trữ chúng dưới dạng đối tượng
-
vì thử nghĩ mà xem, mỗi vị trí
-
lại chứa 2 thông tin cơ bản, x và y.
-
Vì vậy ta có thể có 2 đối tượng mang thuộc tính x và y.
-
Sau đó ta có thể tạo một mảng đối tượng
-
với những vị trí x, y này.
-
Ta cùng làm nhé.
-
Ta nhập var positions =,
-
đây cũng sẽ là một mảng,
-
nhưng mỗi phần tử, thay vì là một số,
-
sẽ là một đối tượng.
-
Ta có ngoặc nhọn,
-
sau đó ta sẽ nhập x 99,
-
y 117.
-
Được rồi, bây giờ ta đã có một trong các vị trí ở đây,
-
ta sẽ thêm một vị trí nữa,
-
và thêm một vị trí nữa.
-
Như vậy, x sẽ là 294, 117.
-
Xong, vị trí thứ ba sẽ là 101, 316.
-
Và cuối cùng là 294
-
và 316.
-
Được rồi, bây giờ ta đã có một mảng đối tượng
-
trong đó mỗi đối tượng đều chứa thuộc tính x và y.
-
Ở dưới đây trong vòng lặp for,
-
ta sẽ chỉ thay đổi cái này để lặp qua positions.length,
-
sau đó ta sẽ đưa vào đối tượng.
-
Hiện tại, ta đang đưa vào toàn bộ đối tượng,
-
nhưng ta chỉ cần đưa vào x và y thôi,
-
vì vậy ta cần có positions[i].x và positions[i].y.
-
Ta-dah!
-
Bây giờ ta có thể xóa chỗ mảng cũ này rồi.
-
Tuyệt vời!
-
Tôi thấy đẹp hơn nhiều rồi đấy,
-
mã dễ đọc hơn nhiều nữa,
-
cứ có mã dễ đọc hơn là tốt rồi.
-
Và ta cũng có thể thêm thắt dễ dàng hơn nữa,
-
nếu tôi muốn thêm,
-
tôi sẽ thêm luôn một cặp vào đây,
-
ta có thể nhập x 200, y 200,
-
cho một Winston nho nhỏ vào giữa đây.
-
Xong.
-
Bây giờ tôi muốn cho các bạn xem một thứ còn hay ho hơn nữa.
-
Hãy chú ý cách hàm của chúng ta tiếp nhận
-
rồi sử dụng 2 số.
-
Ta có thể thay đổi hàm
-
để nó tiếp nhận đối tượng,
-
rồi ta lấy x và y từ đối tượng đó.
-
Điều đó có nghĩa là ta có thể đưa vào đối tượng ở dưới đây.
-
Ta cùng thử nhé.
-
Ta đưa vào một đối tượng, nó hỏng rồi.
-
Đó là bởi hàm của ta cần 2 đối tượng,
-
mà ta lại chỉ đưa vào 1.
-
Vì thế ta sẽ đổi thành facePosition.
-
Bây giờ ta lại nhận được một lỗi có nội dung faceX is not defined
-
vì trước đó, ta đưa vào faceX dưới dạng đối số
-
nhưng lúc này nó không tồn tại.
-
Ta chỉ đang đưa vào một đối tượng, vì vậy ta có thể
-
lưu vị trí x
-
từ một đối tượng trong biến faceX,
-
và ta nghĩ, “Được rồi, mình có đối tượng này.
-
Mình biết đối tượng này có thuộc tính x,
-
vì vậy mình sẽ lưu nó vào biến faceX.”
-
Sau đó ta có thể thực hiện tương tự với y,
-
như vậy faceY = facePosition.y.
-
Ta-dah!
-
Và cuối cùng là phần còn lại của hàm sử dụng faceX và faceY.
-
Bây giờ ta phải đảm bảo đã nhập đúng chính tả.
-
Nếu nhập xx, chương trình sẽ không hoạt động
-
vì đó không phải thứ trong mảng đối tượng
-
mà ta đã đưa vào,
-
vì vậy ta phải nhập thật chính xác.
-
NBây giờ khá gọn gàng rồi đấy,
-
ta có thể có mảng đối tượng,
-
có các hàm nhận đối tượng,
-
và các bạn sẽ thấy rằng chương trình của chúng ta
-
sẽ rất hiệu quả với lối
-
cấu trúc dữ liệu này.
-
Ngoài ra vì ta thường muốn
-
ghép cặp x và y với nhau, tôi nghĩ các bạn sẽ thấy
-
chúng đặc biệt hữu ích cho tất cả
-
những chương trình liên quan đến vẽ và hoạt họa.
-
Chúc các bạn vui vẻ.