Hướng dẫn object trong javascript – đối tượng trong javascript

Đối tượng trong javascrip Như bạn đã biết, JavaScript không phải là một ngôn ngữ lập trình hướng đối tượng, tuy nhiên bạn hoàn toàn có thể lập trình hướng đối tượng thông qua kiểu dữ liệu Object mà JavaScript cung cấp.

Trong JavaScript, đối tượng (object) là một khái niệm trừu tượng thể hiện cho một đối tượng cụ thể và JavaScript có sẵn một số đối tượng như Date, Number. Ngoài các đối tượng này, người lập trình có thể tự tạo một đối tượng theo ý của mình dựa vào yêu cầu của ứng dụng.Date, Number. Ngoài các đối tượng này, người lập trình có thể tự tạo một đối tượng theo ý của mình
dựa vào yêu cầu của ứng dụng.

1, Khởi tạo đối tượng Có 2 cách để tạo 1 đối tượng Có 2 cách để tạo 1 đối tượng

C1: Sử dụng từ khóa new Object()

// Khởi tạo

var

Comment

=

{

}

;

// Thêm thuộc tính

Comment

.

title

=

''

;

Comment

.

content

=

''

;

Comment

.

fullname

=

''

;

Comment

.

email

=

''

;

0

C2: Sử dụng từ khóa {}

// Khởi tạo

var

Comment

=

{

}

;

// Thêm thuộc tính

Comment

.

title

=

''

;

Comment

.

content

=

''

;

Comment

.

fullname

=

''

;

Comment

.

email

=

''

;

1

2, Thuộc tính và phương thức của đối tượng

Mỗi đối thượ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

Khai báo thuộc tính có 3 cách:

C1: Sử dụng từ khóa new Object();

// Khởi tạo

var

Comment

=

new

Object

(

)

;

// Thêm thuộc tính

Comment

.

title

=

''

;

Comment

.

content

=

''

;

Comment

.

fullname

=

''

;

Comment

.

email

=

''

;

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

// Khởi tạo

var

Comment

=

{

title

:

""

,

content

:

""

,

fullname

:

""

,

email

:

""

}

;

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

// Khởi tạo

var

Comment

=

{

}

;

// Thêm thuộc tính

Comment

.

title

=

''

;

Comment

.

content

=

''

;

Comment

.

fullname

=

''

;

Comment

.

email

=

''

;

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à: 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()

Khai báo phương thức cũng có 3 cách tương tự như cách khai báo thuộc tính:

C1: Sử dụng từ khóa new Object();

// Khởi tạo

var

Comment

=

new

Object

(

)

;

// Thêm phương thức

Comment

.

addComment

=

function

(

)

{

// do some thing

}

;

Comment

.

validateComment

=

function

(

)

{

// do some thing

}

;

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

// Khởi tạo

var

Comment

=

{

addComment

:

function

(

)

{

// do some thing

}

,

validateComment

:

function

(

)

{

// do some thing

}

}

;

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

// Khởi tạo

var

Comment

=

{

}

;

// Thêm phương thức

Comment

.

addComment

=

function

(

)

{

// do some thing

}

;

Comment

.

validateComment

=

function

(

)

{

// do some thing

}

;

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à:

validateComment()

Khai báo phương thức cũng có 3 cách tương tự như cách khai báo thuộc tính:

  • Note: Trong 3 cách trên, mình thường hay dùng cách 2 để khai báo thuộc tính và phương thức vì nó dễ dàng quản lý code hơn.
  • 3, Thao tác với thuộc tính và phương thức của đối tượng
  • Sau khi tạo xong đối tượng, để sử dụng đối tượng đó thì chúng ta có các thao tác thông thường như sau:

Note: Trong 3 cách trên, mình thường hay dùng cách 2 để khai báo thuộc tính và phương thức vì nó dễ dàng quản lý code hơn.

3, Thao tác với thuộc tính và phương thức của đối tượng

Comment

.

title

=

"Tiêu đề Comment"

Sau khi tạo xong đối tượng, để sử dụng đối tượng đó thì chúng ta có các thao tác thông thường như sau:

var

Comment

=

{

title

:

""

,

addComment

:

function

(

)

{

this

.

title

=

"Tiêu đề bình luận"

;

}

}

;

3, Thao tác với thuộc tính và phương thức của đối tượng

Sau khi tạo xong đối tượng, để sử dụng đối tượng đó thì chúng ta có các thao tác thông thường như sau:

var

title

=

Comment

.

title

;

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

var

Comment

=

{

title

:

""

,

addComment

:

function

(

)

{

var

title

=

this

.

title

;

}

}

;

Sau khi tạo xong đối tượng, để sử dụng đối tượng đó thì chúng ta có các thao tác thông thường như sau:

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

// Khởi tạo

var

Comment

=

{

title

:

""

,

content

:

""

,

fullname

:

""

,

email

:

""

}

;

0

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

// Khởi tạo

var

Comment

=

{

title

:

""

,

content

:

""

,

fullname

:

""

,

email

:

""

}

;

1

Gọi phương thức

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

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

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

// Khởi tạo

var

Comment

=

{

title

:

""

,

content

:

""

,

fullname

:

""

,

email

:

""

}

;

2

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

// Khởi tạo

var

Comment

=

{

title

:

""

,

content

:

""

,

fullname

:

""

,

email

:

""

}

;

3

Chúng ta gọi phương thức tương tự như thuộc tính.

// Khởi tạo

var

Comment

=

{

}

;

// Thêm thuộc tính

Comment

.

title

=

''

;

Comment

.

content

=

''

;

Comment

.

fullname

=

''

;

Comment

.

email

=

''

;

4

// Khởi tạo

var

Comment

=

{

}

;

// Thêm thuộc tính

Comment

.

title

=

''

;

Comment

.

content

=

''

;

Comment

.

fullname

=

''

;

Comment

.

email

=

''

;

5

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

4, Đối tượng chứa đối tượng – Mảng chứa đối tượng

// Khởi tạo

var

Comment

=

{

title

:

""

,

content

:

""

,

fullname

:

""

,

email

:

""

}

;

4

// Khởi tạo

var

Comment

=

{

title

:

""

,

content

:

""

,

fullname

:

""

,

email

:

""

}

;

5

Mỗi đối tượng (object) trong JavaScript có thể chứa các đối tượng khác hoặc một mảng có thể chứa các đối tượng.

Đối tượng chứa đối tượng

Gom các thuộc tính của Comment vào 1 đối tượng

// Khởi tạo

var

Comment

=

{

}

;

// Thêm thuộc tính

Comment

.

title

=

''

;

Comment

.

content

=

''

;

Comment

.

fullname

=

''

;

Comment

.

email

=

''

;

2Gom các phương thức của Comment vào đối tượng

// Khởi tạo

var

Comment

=

{

}

;

// Thêm thuộc tính

Comment

.

title

=

''

;

Comment

.

content

=

''

;

Comment

.

fullname

=

''

;

Comment

.

email

=

''

;

3

Như vậy ta có thể truy xuất tới các thuộc tính và phương thức đó : vậy làm sao để thêm thuộc tính và phương thức vào prototype của 1 đối tượng?

// Khởi tạo

var

Comment

=

{

title

:

""

,

content

:

""

,

fullname

:

""

,

email

:

""

}

;

7

Mảng chứa đối tượng

// Khởi tạo

var

Comment

=

{

title

:

""

,

content

:

""

,

fullname

:

""

,

email

:

""

}

;

8

Việc gán giá trị là một đối tượng vào mảng cũng tương tự như gán các giá trị bình thường khác.

// Khởi tạo

var

Comment

=

{

title

:

""

,

content

:

""

,

fullname

:

""

,

email

:

""

}

;

9

5, Prototype trong JavaScript