Kiểm tra kỹ năng: Biến

Thử thách tương tác

Trước tiên, chúng ta cung cấp cho bạn một thử thách biến tương tác thú vị được tạo bởi đối tác học tập của chúng ta, Scrimba.

Xem scrim nhúng và hoàn thành nhiệm vụ trên dòng thời gian (biểu tượng bóng ma nhỏ) bằng cách làm theo hướng dẫn và chỉnh sửa mã. Khi bạn hoàn thành, bạn có thể tiếp tục xem scrim để kiểm tra xem giải pháp của giáo viên khớp với giải pháp của bạn như thế nào.

Biến 1

Để hoàn thành nhiệm vụ này, hãy thêm một dòng mới để sửa giá trị được lưu trong biến myName hiện có thành tên của bạn.

<section></section>

* {
  box-sizing: border-box;
}

p {
  color: purple;
  margin: 0.5em 0;
}

Điểm khởi đầu của nhiệm vụ trông như thế này:

Đây là mã cơ sở cho điểm khởi đầu này:

let myName = "Paul";

// Don't edit the code above here!

// Add your code here

// Don't edit the code below here!

const section = document.querySelector("section");
const para = document.createElement("p");
para.textContent = myName;
section.appendChild(para);

Đầu ra cập nhật sẽ trông như thế này:

// ...
// Don't edit the code above here!

myName = "Chris";

// Don't edit the code below here!
// ...

let myName = "Paul";

myName = "Chris";

const section = document.querySelector("section");
const para = document.createElement("p");
para.textContent = myName;
section.appendChild(para);

Biến 2

Nhiệm vụ cuối cùng bây giờ — trong trường hợp này bạn được cung cấp một số mã hiện có có hai lỗi trong đó. Panel kết quả sẽ xuất ra tên Chris, và một câu về độ tuổi Chris sẽ có sau 20 năm nữa. Chúng ta muốn bạn sửa vấn đề và sửa đầu ra.

Điểm khởi đầu của nhiệm vụ trông như thế này (chưa có gì hiển thị):

Đây là mã cơ sở cho điểm khởi đầu này:

// Fix the following code

const myName = "Default";
myName = "Chris";

let myAge = "42";

// Don't edit the code below here!

const section = document.querySelector("section");
const para1 = document.createElement("p");
const para2 = document.createElement("p");
para1.textContent = myName;
para2.textContent = `In 20 years, I will be ${myAge + 20}`;
section.appendChild(para1);
section.appendChild(para2);

Đầu ra cập nhật sẽ trông như thế này:

// Turn the const into a let, so the value can be changed
let myName = "Default";
myName = "Chris";

// myAge needs to have a number datatype
let myAge = 42;

// Don't edit the code below here!
// ...

let myName = "Default";
myName = "Chris";
let myAge = 42;

const section = document.querySelector("section");
const para1 = document.createElement("p");
const para2 = document.createElement("p");
para1.textContent = myName;
para2.textContent = `In 20 years, I will be ${myAge + 20}`;
section.appendChild(para1);
section.appendChild(para2);

Xem thêm

Xem Practice time - Part 3: let and const ^{Đối tác học tập MDN} từ Scrimba: Một thử thách tương tác cung cấp nhiều bài kiểm tra về let và const.

• Previous
• Overview: Lập trình động với JavaScript
• Next