[Script Info]
Title: 
[Events]
Format: Layer, Start, End, Style, Name, MarginL, MarginR, MarginV, Effect, Text
Dialogue: 0,0:00:01.27,0:00:03.74,Default,,0000,0000,0000,,Cho đến thời điểm hiện tại, ta đã nắm được cách tạo và truy cập mảng.
Dialogue: 0,0:00:03.74,0:00:12.86,Default,,0000,0000,0000,,Dù tương tự những biến khác, nhưng một trong những điều thú vị về mảng là ta có thể chủ động thay đổi khi chương trình đang hoạt động.
Dialogue: 0,0:00:12.86,0:00:15.80,Default,,0000,0000,0000,,Để tôi cho các bạn xem nhé.
Dialogue: 0,0:00:15.80,0:00:21.17,Default,,0000,0000,0000,,Ở đây ta có chương trình hiển thị Hopper đang giữ mấy quả bóng bay; siêu đáng yêu.
Dialogue: 0,0:00:21.17,0:00:29.40,Default,,0000,0000,0000,,Như vậy ta có vị trí x này với hai số thể hiện vị trí của bóng nay mà ta muốn.
Dialogue: 0,0:00:29.40,0:00:35.47,Default,,0000,0000,0000,,Dưới đây ta có vòng lặp này, và nó sẽ lướt qua tất cả các phần tử trong mảng.
Dialogue: 0,0:00:35.47,0:00:46.81,Default,,0000,0000,0000,,Với mỗi phần tử, vòng lặp sẽ vẽ một đường thẳng từ “x” xuống bàn tay của Hopper, sau đó vẽ một hình e-lip tại “x” với kích thước 30x40 pixel, đó chính là quả bóng bay của chúng ta.
Dialogue: 0,0:00:46.81,0:00:58.34,Default,,0000,0000,0000,,Được rồi. Sau khi quan sát cách hoạt động, ta biết rằng nếu phải thêm một quả bóng nữa, ta chỉ cần thêm một số vào mảng này, đúng không? Ví dụ 300.
Dialogue: 0,0:00:58.34,0:01:02.06,Default,,0000,0000,0000,,Đẹp rồi đấy. Vậy là ta đã có 3 quả bóng bay cho Hopper vui vẻ.
Dialogue: 0,0:01:02.06,0:01:10.93,Default,,0000,0000,0000,,Nhưng hãy giả sử ta muốn người sử dụng nào đó, một người không biết viết mã, thêm bóng bay vào chương trình.
Dialogue: 0,0:01:10.93,0:01:17.80,Default,,0000,0000,0000,,Ta đưa chương trình cho người đó và nói rằng, “Này, anh có thể click vào bất cứ vị trí nào muốn thêm bóng bay, và nó sẽ xuất hiện.”
Dialogue: 0,0:01:17.80,0:01:20.69,Default,,0000,0000,0000,,Thế sẽ khá hay ho đấy. Tôi nghĩ vậy.
Dialogue: 0,0:01:20.69,0:01:26.64,Default,,0000,0000,0000,,Vậy ta nên làm như thế nào? Ta muốn chương trình thay đổi theo thời gian, phải không?
Dialogue: 0,0:01:26.64,0:01:30.28,Default,,0000,0000,0000,,Mỗi khi người sử dụng click chuột, một quả bóng sẽ xuất hiện tại vị trí đó.
Dialogue: 0,0:01:30.28,0:01:37.64,Default,,0000,0000,0000,,Ta bắt đầu với việc di chuyển tất cả mọi thứ vào hàm draw để chương trình có thể dễ dàng thay đổi theo thời gian.
Dialogue: 0,0:01:37.64,0:01:43.18,Default,,0000,0000,0000,,Ta sẽ đưa cái này xuống đây và lùi dòng vào đây. Ổn rồi đấy.
Dialogue: 0,0:01:43.18,0:01:48.40,Default,,0000,0000,0000,,Bây giờ nếu ta muốn kiểm tra xem hiện tại người sử dụng có click chuột hay không thì sao?
Dialogue: 0,0:01:48.40,0:01:55.34,Default,,0000,0000,0000,,Ta có thể làm điều đó với hàm “if”. Như vậy if (mouseIsPressed), sau đó ta sẽ thực hiện một thao tác.
Dialogue: 0,0:01:55.34,0:02:01.18,Default,,0000,0000,0000,,Đó là thao tác gì? Khi người sử dụng click chuột, ta sẽ muốn thêm một số vào mảng này.
Dialogue: 0,0:02:01.18,0:02:04.23,Default,,0000,0000,0000,,Ta đưa nó quay về với hai phần tử nhé. OK.
Dialogue: 0,0:02:04.23,0:02:10.46,Default,,0000,0000,0000,,Như vậy ta muốn bằng cách nào đó thêm một số vào mảng. Tôi sẽ chỉ cho các bạn cách này.
Dialogue: 0,0:02:10.46,0:02:18.51,Default,,0000,0000,0000,,Ta có thể nhập xPositions[2] = mouseX.
Dialogue: 0,0:02:18.51,0:02:21.68,Default,,0000,0000,0000,,Được rồi ta cùng quan sát nhé.
Dialogue: 0,0:02:21.68,0:02:26.64,Default,,0000,0000,0000,,Tôi click chuột, và ta-da tôi đã có một quả bóng bay. Vậy bản chất là gì?
Dialogue: 0,0:02:26.64,0:02:38.24,Default,,0000,0000,0000,,xPositions[2] sẽ ra lệnh tìm mảng, và tìm phần tử số 2, và hãy nhớ rằng đó là phần tử thứ ba vì các mảng đều bắt đầu từ số 0.
Dialogue: 0,0:02:38.24,0:02:41.74,Default,,0000,0000,0000,,Và nếu các bạn quan sát thì sẽ thấy không có phần tử thứ ba, đúng không? Không có gì cả.
Dialogue: 0,0:02:41.74,0:02:45.90,Default,,0000,0000,0000,,Như vậy nó sẽ ra lệnh tìm phần tử, rồi đưa vào mouseX.
Dialogue: 0,0:02:45.90,0:02:51.36,Default,,0000,0000,0000,,Chính vì vị trí đó không có phần tử, nên nó sẽ từ không có gì trở thành mouseX.
Dialogue: 0,0:02:51.36,0:03:00.13,Default,,0000,0000,0000,,Hiện tại mảng của chúng ta đã có 3 phần tử, và vòng lặp for dưới đây sẽ quét lại, và cuối cùng ta có quả bóng bay thứ ba.
Dialogue: 0,0:03:00.13,0:03:04.03,Default,,0000,0000,0000,,Khá hay ho phải không. Để tôi click thêm vài lần nữa xem sao nhé.
Dialogue: 0,0:03:04.03,0:03:10.69,Default,,0000,0000,0000,,Như các bạn thấy, mỗi lần click chuột, chương trình sẽ vẽ quả bóng thứ ba tại vị trí click.
Dialogue: 0,0:03:10.69,0:03:18.94,Default,,0000,0000,0000,,Đó là bởi ta đang liên tục ghi đè lên phần tử số 2.
Dialogue: 0,0:03:18.94,0:03:22.90,Default,,0000,0000,0000,,Ta đang ghi đè với mouseX hiện tại.
Dialogue: 0,0:03:22.90,0:03:34.57,Default,,0000,0000,0000,,Vì vậy ta sẽ mãi mãi chỉ có 3 quả bóng bay vì ta đã có một quả số 0, một quả số 1, và đang liên tục thay đổi quả số 2. Đúng không?
Dialogue: 0,0:03:34.57,0:03:40.24,Default,,0000,0000,0000,,Thú vị đấy, nhưng cái ta muốn là người sử dụng có thể tạo hàng đống bóng bay mà.
Dialogue: 0,0:03:40.24,0:03:43.52,Default,,0000,0000,0000,,Sao cho mỗi lần người sử dụng click chuột sẽ có một quả bóng bay mới.
Dialogue: 0,0:03:43.52,0:03:50.85,Default,,0000,0000,0000,,Điều đó có nghĩa là ta phải liên tục gia tăng chỉ số phần tử mảng đang lưu trữ.
Dialogue: 0,0:03:50.85,0:03:56.11,Default,,0000,0000,0000,,Ta không muốn mỗi lần click chuột đều là số 2 nữa, mà phải là 2, sau đó là 3, rồi 4, rồi 5, rồi 6, v.v.
Dialogue: 0,0:03:56.11,0:04:01.02,Default,,0000,0000,0000,,Ta có thể làm điều đó bằng cách thêm một biến đếm. Ta nhập newInd = 2;
Dialogue: 0,0:04:01.02,0:04:05.52,Default,,0000,0000,0000,,Đó là khởi đầu, sau đó ta sẽ nhập newInd thay cho 2.
Dialogue: 0,0:04:05.52,0:04:10.27,Default,,0000,0000,0000,,Và cuối cùng ta nhập newInd ++
Dialogue: 0,0:04:10.27,0:04:16.23,Default,,0000,0000,0000,,Như vậy với mỗi lần lặp  ta cộng 1 vào newInd. Ta sẽ bắt đầu với 2, sau đó là 3, rồi kế đến là 4.
Dialogue: 0,0:04:16.23,0:04:18.47,Default,,0000,0000,0000,,Mỗi khi người sử dụng click chuột, biến sẽ tăng dần. Ta cùng thử nhé.
Dialogue: 0,0:04:18.47,0:04:22.01,Default,,0000,0000,0000,,Ta-da! Một đống bóng bay. Tiệc bóng bay nào.Woo!
Dialogue: 0,0:04:22.01,0:04:32.11,Default,,0000,0000,0000,,Hay ho thật đấy. Nhưng đó vẫn chưa phải cách tối ưu bởi ta còn muốn thêm rất rất nhiều phần tử vào mảng.
Dialogue: 0,0:04:32.11,0:04:35.02,Default,,0000,0000,0000,,Vì thế ta còn một cách thậm chí còn đơn giản hơn nữa.
Dialogue: 0,0:04:35.02,0:04:42.77,Default,,0000,0000,0000,,Để tôi xóa những gì chúng ta vừa làm đã. Được rồi, ta không cần cái đó, thực ra cũng chẳng cần nữa. Ta sẽ cho vào chú thích thôi.
Dialogue: 0,0:04:42.77,0:04:50.100,Default,,0000,0000,0000,,Được rồi, cái chúng ta cần làm là nhập xPositions.push và mouseX.
Dialogue: 0,0:04:50.100,0:04:56.57,Default,,0000,0000,0000,,Như vậy ta đang gọi phương thức này vào mảng xPositions.
Dialogue: 0,0:04:56.57,0:05:05.23,Default,,0000,0000,0000,,Cái ta gọi giống như một câu lệnh trong mảng. Ta ra lệnh cho mảng, “Này, hãy đẩy giá trị mới mouseX này tới cuối mảng đi.”
Dialogue: 0,0:05:05.23,0:05:12.47,Default,,0000,0000,0000,,Và với mỗi lần gọi, mỗi lần người sử dụng click chuột, chương trình sẽ tìm mouseX và đẩy nó xuống cuối mảng.
Dialogue: 0,0:05:12.47,0:05:16.77,Default,,0000,0000,0000,,Từ đó mảng sẽ ngày càng lớn dần. Ta cùng thử lại từ đầu nhé.
Dialogue: 0,0:05:16.77,0:05:22.68,Default,,0000,0000,0000,,Ta-da, thành công rồi! Đỡ phải viết mã hơn rất nhiều đúng không?
Dialogue: 0,0:05:22.68,0:05:27.63,Default,,0000,0000,0000,,Hầu hết thời gian ta sẽ muốn sử dụng push khi cần thêm phần tử cho mảng như ví dụ này.
Dialogue: 0,0:05:27.63,0:05:32.18,Default,,0000,0000,0000,,Đồng thời cũng sẽ khá gọn gàng vì ta chỉ có một mảng này phát triển trong chương trình thôi.
Dialogue: 0,0:05:32.18,0:05:36.02,Default,,0000,0000,0000,,Giống như khi ta sử dụng animation hay muốn người sử dụng thực hiện các thao tác, từ đó ta có thể làm nhiều thứ hơn nữa.
Dialogue: 0,0:05:36.02,0:05:41.30,Default,,0000,0000,0000,,Hiện tại các bạn đã tìm hiểu được 90% công dụng của mảng cũng như cách thức sử dụng mảng.
Dialogue: 0,0:05:41.30,0:05:47.02,Default,,0000,0000,0000,,Nhưng ta vẫn có thể áp dụng nhiều hơn nữa đối với mảng. Nếu có bất kỳ câu hỏi nào, đừng ngần ngại đưa ra trong phần thảo luận.
Dialogue: 0,0:05:47.02,0:00:00.00,Default,,0000,0000,0000,,Nhưng hãy đảm bảo mình nắm vững được kiến thức cơ bản đã.