Tự học JavaScript - Module 5: Đối tượng (Objects) - Trái tim của JS

Open Table of contents

1. Đối tượng (Object) là gì?
2. Truy cập thuộc tính đối tượng
3. Phương thức của Đối tượng (Object Methods)
- Từ khóa this:
4. Tại sao cần sử dụng Đối tượng thay vì Mảng?
5. Lưu ý về Hằng số Const
Lời kết Module 5

1. Đối tượng (Object) là gì?

Trong thế giới thực, một chiếc ô tô là một đối tượng. Nó có các thuộc tính (attributes) như màu sắc, trọng lượng và các phương thức (methods) như khởi động, phanh.

Trong JavaScript, đối tượng là một tập hợp các cặp Tên: Giá trị (Key: Value).

const car = {
  type: "Fiat",
  model: "500",
  color: "white"
};

2. Truy cập thuộc tính đối tượng

Bạn có hai cách để lấy giá trị từ một đối tượng:

Dùng dấu chấm (.): objectName.propertyName (Phổ biến nhất).
Dùng ngoặc vuông ([]): objectName["propertyName"].

console.log(car.type);     // "Fiat"
console.log(car["model"]); // "500"

3. Phương thức của Đối tượng (Object Methods)

Đối tượng không chỉ chứa dữ liệu tĩnh, nó còn có thể chứa các hàm. Khi một hàm là thuộc tính của đối tượng, nó được gọi là Phương thức.

const person = {
  firstName: "Tuấn",
  lastName: "Nguyễn",
  fullName: function() {
    return this.firstName + " " + this.lastName;
  }
};

Từ khóa `this`:

Trong một phương thức, từ khóa this ám chỉ chủ sở hữu của phương thức đó (chính là đối tượng đang chứa nó). Trong ví dụ trên, this.firstName chính là person.firstName.

4. Tại sao cần sử dụng Đối tượng thay vì Mảng?

Mảng: Dùng khi bạn muốn quản lý một danh sách mà vị trí (số thứ tự) là quan trọng.
Đối tượng: Dùng khi bạn muốn gán tên (nhãn) cho từng giá trị để dễ dàng truy xuất và quản lý logic phức tạp.

5. Lưu ý về Hằng số Const

Khi bạn khai báo một đối tượng với const, bạn không thể gán lại toàn bộ đối tượng mới cho biến đó, nhưng bạn hoàn toàn có thể thay đổi giá trị của các thuộc tính bên trong nó.

const person = { name: "Tuấn" };
person.name = "Anh Pi"; // Hợp lệ
// person = { name: "Hải" }; // Lỗi!

Lời kết Module 5

Đối tượng là nền tảng của mọi thư viện JS lớn như React hay Vue sau này. Hãy tập thói quen tổ chức dữ liệu theo dạng Object để code của bạn khoa học và dễ mở rộng hơn.

Trong Module 6, chúng ta sẽ học cách làm cho chương trình trở nên tự động hóa hơn với Vòng lặp (Loops).

Hẹn gặp lại các bạn!

Table of contents