Return to Video

Terrific Text Part 2

  • 0:01 - 0:05
    Trong video này, ta sẽ lập trình
    nâng cao hơn với lệnh "text".
  • 0:05 - 0:06
    Đầu tiên, chúng ta sẽ bắt đầu
  • 0:06 - 0:08
    học cách sử dụng
    "string" (chuỗi ký tự).
  • 0:08 - 0:11
    Vậy "string" hay chuỗi ký tự là gì?
  • 0:11 - 0:13
    Trong lập trình, đây là
    một tên gọi đặc biệt
  • 0:13 - 0:15
    sử dụng cho một kiểu dữ liệu.
  • 0:15 - 0:17
    Bạn hãy hiểu "string" là
    một chuỗi các ký tự.
  • 0:17 - 0:19
    Tên bạn là một "string",
    tên trường học là một "string"
  • 0:19 - 0:22
    và mỗi tin nhắn mà bạn
    từng gửi cũng là một "string".
  • 0:22 - 0:25
    Về cơ bản, có thể coi "string"
    bằng với "text" (nghĩa là văn bản).
  • 0:26 - 0:29
    Chúng ta đã học cách viết
    và đổi màu các "string".
  • 0:29 - 0:31
    Vậy ta hoàn toàn có thể
    dùng biến với các "string".
  • 0:31 - 0:33
    Tương tự như cách
    gán một giá trị cho một biến,
  • 0:33 - 0:35
    ta cũng có thể
    gán một "string" cho một biến.
  • 0:35 - 0:37
    Chúng ta có thể nhập như sau:
  • 0:37 - 0:41
    "var myName =", rồi nhập
    tên bạn, "Sophia" chẳng hạn.
  • 0:41 - 0:43
    Đừng quên đặt giữa dấu ngoặc kép.
  • 0:43 - 0:44
    Sau đó, chúng ta đặt biến "myName"
  • 0:44 - 0:47
    giữa dấu ngoặc kép thay vì "Sophia"
  • 0:47 - 0:49
    như ta đã làm trước kia.
  • 0:49 - 0:51
    Tuy kết quả trả về không thay đổi
  • 0:51 - 0:53
    nhưng ta có thể nhập
    vô số lệnh "text" tương tự
  • 0:53 - 0:55
    và thay đổi giá trị các tham số
  • 0:55 - 0:57
    để trình bày văn bản
    một cách nghệ thuật.
  • 0:57 - 0:59
    Tiếp theo, bạn chỉ cần
    đặt biến "myName"
  • 0:59 - 1:02
    thành "Your Name",
    nghĩa là tên của bạn
  • 1:02 - 1:04
    là bạn đã có tên bạn
    được viết lại 3 lần.
  • 1:04 - 1:07
    Bây giờ, ta đổi lại thành "Sophia"
    để tiếp tục bài học.
  • 1:07 - 1:10
    Liệu ta có thể gán các "string"
    phụ thuộc vào nhau
  • 1:10 - 1:13
    như cách gán biến này
    phụ thuộc vào biến khác hay không?
  • 1:13 - 1:15
    Chúng ta có thể thực hiện được
  • 1:15 - 1:17
    và chương trình sẽ liên kết
    hai "string" với nhau.
  • 1:17 - 1:20
    Ví dụ, chúng ta có thể
    xóa bớt hai lệnh "text",
  • 1:20 - 1:22
    chỉ sử dụng một lệnh "text
    và thêm một biến "message"
  • 1:22 - 1:27
    gán với biến "myName"
    cộng thêm ba dấu chấm than.
  • 1:28 - 1:30
    Sau đó, nếu chúng ta
    thế "message" vào lệnh "text"
  • 1:30 - 1:33
    thay vì "myName",
    ta có thể thấy rằng
  • 1:33 - 1:35
    3 dấu chấm than đã
    được thêm vào sau
  • 1:35 - 1:37
    biến "myName" là "Sophia",
    như cú pháp của biến "message".
  • 1:38 - 1:40
    Chúng ta còn có thể
    thực hiện thêm thao tác
  • 1:40 - 1:43
    chẳng hạn như
    viết biến "message" hai lần.
  • 1:43 - 1:46
    Như vậy, việc gán các "string"
    phụ thuộc vào nhau
  • 1:46 - 1:49
    nghĩa là ta gán một "string"
    vào sau một "string" khác.
  • 1:49 - 1:52
    Liệu ta có thể thực hiện
    thao tác nâng cao hơn không?
  • 1:52 - 1:55
    Chẳng hạn như thực hiện nhân,
    chia hoặc trừ các "string"?
  • 1:55 - 1:57
    Trên thực tế, ta không thể
    thực hiện các thao tác này.
  • 1:57 - 1:59
    Ta chỉ có thể thêm
    "string" này vào "string" khác.
  • 1:59 - 2:02
    Ta có thể chia hoặc trừ
    với các biến có giá trị là số,
  • 2:02 - 2:05
    nhưng với biến "string"
    thì ta chỉ được thêm "string".
  • 2:05 - 2:07
    Tuy nhiên, việc tò mò
    và đặt những câu hỏi như vậy
  • 2:07 - 2:10
    là thái độ học tập
    đúng đắn với lập trình.
  • 2:10 - 2:12
    Bạn hoàn toàn có thể
    tự đặt câu hỏi như vậy.
  • 2:13 - 2:17
    Ta cũng có thể tạo hiệu ứng hoạt hình
    và tương tác chuột với các "string".
  • 2:18 - 2:20
    Ví dụ, ta có thể làm cho "string"
    đổi vị trí theo con trỏ chuột
  • 2:20 - 2:23
    bằng cách gán "string" với hàm "draw"
    như khi làm với hình chữ nhật.
  • 2:23 - 2:26
    Ta nhập như sau:
    "var draw = function()"
  • 2:27 - 2:30
    và đưa tất cả vào hàm "draw".
  • 2:30 - 2:33
    Tương tự như khi học về
    hiệu ứng hoạt hình, phải không?
  • 2:33 - 2:36
    Bây giờ, để khiến văn bản di chuyển
    theo vị trí di con trỏ chuột,
  • 2:36 - 2:39
    chúng ta cần dùng đến biến
    "mouseX" và "mouseY".
  • 2:39 - 2:43
    Và kết quả trả về là vô số chữ
    "Sophia!!!" được hiển thị liên tục.
  • 2:43 - 2:47
    Đương nhiên nếu muốn,
    chúng ta có thể thêm lệnh "background"
  • 2:47 - 2:51
    để đổi màu nền thành xanh lam nhạt.
  • 2:51 - 2:55
    Và bây giờ, ta đã thành công làm cho chữ
    di chuyển theo vị trí di con trỏ chuột,
  • 2:55 - 2:57
    tương tự như với hình chữ nhật.
  • 2:57 - 3:00
    Tiếp theo, chúng ta sẽ cùng
    tạo hiệu ứng hoạt hình
  • 3:00 - 3:03
    để làm cho kích thước văn bản to dần.
  • 3:03 - 3:06
    Đầu tiên, áp dụng kiến thức đã học
    về biến, thay vì sử dụng "textSize(30)"
  • 3:06 - 3:11
    ta có thể nhập biến như sau:
    "var howBig = 30;"
  • 3:11 - 3:14
    và thay biến này vào "textSize"
    thay vì trực tiếp dùng số 30.
  • 3:15 - 3:16
    Kết quả trả về vẫn như trước.
  • 3:16 - 3:19
    Vì vậy, ta cần thêm
    hoặc thay đổi chương trình
  • 3:19 - 3:20
    để tạo được hiệu ứng hoạt hình.
  • 3:20 - 3:25
    Ta có thể nhập thêm
    "howBig = howBig + 1"
  • 3:25 - 3:28
    để cộng thêm một vào giá trị
    khởi tạo ban đầu
  • 3:28 - 3:32
    của biến "howBig"
    để làm cho nó lớn hơn.
  • 3:32 - 3:35
    Bây giờ, chúng ta chỉ cần
    chạy lại cho chương trình
  • 3:35 - 3:37
    và kết quả trả về là
    khi ta di con trỏ chuột,
  • 3:37 - 3:40
    kích thước văn bản cũng to dần
  • 3:40 - 3:42
    nhờ vào dòng
    "howBig = howBig + 1" này.
  • 3:43 - 3:45
    Tại sao bạn không
    thử tự nghĩ
  • 3:45 - 3:48
    cách để làm cho kích thước
    văn bản to nhanh hơn?
  • 3:48 - 3:52
    Như vậy, không chỉ học được
    cách lập trình với các hình vẽ
  • 3:52 - 3:55
    mà qua video này, bạn đã nắm được
    cách lập trình với văn bản.
Title:
Terrific Text Part 2
Description:

more » « less
Video Language:
English
Duration:
03:57

Vietnamese subtitles

Revisions Compare revisions