Đối tượng trong JavaScript và những điều bạn cần biết

Bạn đang tìm hiểu về ngôn ngữ lập trình JavaScript hay chỉ đơn giản bạn muốn tìm hiểu đối tượng trong JavaScript là gì, bạn tìm đúng bài viết rồi đấy. Mẫu Website 24h sẽ giải đáp toàn bộ thắc mắc của bạn trong bài viết này.

Đối tượng trong JavaScript là gì ?

Khái niệm đối tượng trong JavaScript rất trừu tượng, đối tượng (object) được dùng để thể hiện các đối tượng mà qua đó có thể thêm các thuộc tính và phương thức cho đối tượng đó.

Ta có một số đội tượng sẵn như Date, Number. Ngoài các đối tượng này thì các lập trình viên còn có thể tự tạo một đối tượng riêng theo ý của mình.

Cú pháp khởi tạo đối tượng như sau:

Cách 1: Sử dụng từ khóa new Object()

1
varComment = newObject();

Cách 2: Sử dụng từ khóa {}

1
varComment = {};

Khi khai báo một object thì chúng ta đang tạo một instance của đối tượng, tức là bản thân đối tượng Object là một constructor. Vậy nên, ta không thể sử dụng từ khóa new để tạo instance từ một instance.

Thuộc tính/phương thức của đối tượng trong JavaScript

Mỗi đối tượng sẽ có các thuộc tính và phương thức.

Thuộc tính

Thuộc tính là những đặc điểm (có thể hiểu là biến) cần lưu trữ trong đối tượng. Ví dụ với đối tượng Comment thì mình cần các thuộc tính sau.

  • title
  • content
  • fullname
  • email

Lúc này ta có thể khai báo bằng ba cách.

Cách 1: Sử dụng từ khóa new Object()

Cách 2: Sử dụng từ khóa {} và thêm thuộc tính ngay lúc khai báo

Cách 3: Sử dụng từ khóa {} và thêm thuộc tính sau đó

Trong ba cách trên thì mình khuyến khích các bạn nên sử dụng cách thứ hai bởi vì nó mạch lạc và dễ quản lý code hơn.

Phương thức

Phương thức là những hành động (có thể hiểu là hàm) của đối tượng. Ví dụ trong đối tượng Comment thì mình cần hai phương thức là:

  • addComment()
  • validateComment()

Ta có 3 cách để khai báo như sau:

Cách 1: Sử dụng từ khóa new Object()

Cách 2: Sử dụng từ khóa {} và thêm phương thức ngay lúc khai báo

Cách 3: Sử dụng từ khóa {} và thêm phương thức sau đó

Mẫu Website 24h cũng khuyến khích các bạn nên sử dụng cách 2.

Thao tác với thuộc tính và phương thức của object trong JavaScript

Sau khi tạo xong đối tượng thì ta có hai cách sử dụng căn bản là gọi và gán dữ liệu cho thuộc tính và phương thức. Thông thường chúng ta có các thao tác như sau:

  • Gán giá trị cho thuộc tính
  • Lấy giá trị của thuộc tính
  • Gọi phương thức

Gán giá trị cho thuộc tính

Để gán giá trị cho thuộc tính chúng ta chỉ việc thực hiện bằng cách sử dụng toán tử = giống như cách gán giá trị cho biến.

Đối tượng trong JavaScript

Nhưng nếu bạn gọi từ một hàm trong đối tượng thì bạn có thể sử dụng từ khóa this.

Đối tượng trong JavaScript

Lấy giá trị của thuộc tính

Để lấy giá trị thuộc tính thì ta làm tương tự như thao tác với biến.

Đối tượng trong JavaScript

Nếu gọi từ một hàm trong đối tượng thì bạn có thể sử dụng từ khóa this.

Đối tượng trong JavaScript

Xóa thuộc tính

Nếu bạn muốn xóa thuộc tính nào đó thì sử dụng từ khóa delete.

Đối tượng trong JavaScript

Gọi phương thức

Tương tự như thuộc tính chúng ta gọi bình thường.

Đối tượng trong JavaScript

Gọi trong hàm của đối tượng.

Đối tượng trong JavaScript

Lặp qua từng phần tử của đối tượng trong JavaScript

Muốn lặp qua từng phần tử của object thì ta sử dụng vòng lặp for .. in.

Cú pháp
1
2
3
for(key inobject) {
  // key chính là phần tử trong quá trình lặp
}

Lời kết

Đến đây bạn đã hiểu đối tượng trong JavaScript là gì hay chưa? Sau bài chia sẻ của Mẫu Website 24h, hy vọng bạn có thể hiểu khái niệm một cách đơn giản nhất và thao tác với đối tượng trong JavaScript. Chúc các bạn thành công.

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *