Định nghĩa đối tượng trong JavaScript

Bài trước>>>Tìm hiểu về chuỗi JSON trong JavaScript

Trong JavaScript, các đối tượng là vua. Nếu bạn hiểu các đối tượng, bạn hiểu JavaScript.

Trong JavaScript, gần như “mọi thứ” là một đối tượng.

  • Boolean có thể là đối tượng (nếu được xác định bằng từ khóa new )
  • Number (số) có thể là đối tượng (nếu được xác định bằng từ khóa new )
  • String (chuỗi) có thể là đối tượng (nếu được xác định bằng từ khóa new )
  • Date (ngày) luôn là đối tượng
  • Math (toán học) luôn là đối tượng
  • Regular expression (biểu thức chính quy) luôn là đối tượng
  • Array (mảng) luôn là đối tượng
  • Function (hàm) luôn là đối tượng
  • Object (đối tượng) luôn là đối tượng

Tất cả các giá trị JavaScript, ngoại trừ nguyên thủy, là các đối tượng.

JavaScript nguyên thủy

Một giá trị nguyên thủy là một giá trị mà không có thuộc tính hoặc phương thức.

Một kiểu dữ liệu nguyên thủy là dữ liệu có giá trị nguyên thủy.

JavaScript định nghĩa 5 loại kiểu dữ liệu nguyên thủy:

  • string (chuỗi)
  • number (số)
  • boolean
  • null (rỗng)
  • undefined (chưa xác định)

Giá trị nguyên thủy là bất biến (chúng được mã hóa cứng và do đó không thể thay đổi).

nếu x = 3.14, bạn có thể thay đổi giá trị của x. Nhưng bạn không thể thay đổi giá trị của 3.14.

Giá trị Kiểu Bình luận
“Xin chào” chuỗi “Xin chào” luôn là “Xin chào”
3.14  số 3,14 luôn là 3,14
true boolean true luôn luôn là true
false boolean false luôn luôn là false
null null (đối tượng) null luôn là null
undefined không xác định không xác định luôn luôn không xác định

Đối tượng là biến

Các biến JavaScript có thể chứa các giá trị đơn:

Ví dụ

var person = "John Doe";
<!DOCTYPE html>
<html>
<body>

<h2>JavaScript Variables</h2>

<p id="demo"></p>

<script>
// Create aand display a variable:
var person = "John Doe";
document.getElementById("demo").innerHTML = person;
</script>

</body>
</html>

Các đối tượng cũng là biến. Nhưng các đối tượng có thể chứa nhiều giá trị.

Các giá trị được viết dưới dạng cặp tên: giá trị (tên và giá trị được phân tách bằng dấu hai chấm).

Ví dụ

var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
<!DOCTYPE html>
<html>
<body>

<p>Creating a JavaScript Object.</p>

<p id="demo"></p>

<script>
var person = {
firstName : "John",
lastName : "Doe",
age : 50,
eyeColor : "blue"
};

document.getElementById("demo").innerHTML = person.firstName + " " + person.lastName;
</script>

</body>
</html>

Đối tượng JavaScript là tập hợp các giá trị được đặt tên

Thuộc tính đối tượng

Các giá trị được đặt tên, trong các đối tượng JavaScript, được gọi là các thuộc tính .

Thuộc tính Giá trị
firstName John
lastName Doe
 age (tuổi) 50
eyeColor (màu mắt) màu xanh da trời

Các đối tượng được viết dưới dạng cặp giá trị tên tương tự như:

  • Mảng liên kết trong PHP
  • Từ điển trong Python
  • Bảng băm trong C
  • Bản đồ băm trong Java
  • Băm trong Ruby và Perl

Các phương thức đối tượng

Phương thức là những hành động có thể được thực hiện trên các đối tượng. Các thuộc tính đối tượng có thể là cả các giá trị nguyên thủy, các đối tượng khác và các hàm.

Một phương thức đối tượng là một thuộc tính đối tượng chứa một định nghĩa hàm .

Thuộc tính Giá trị
firstName (tên) John
lastName (họ) Doe
age (tuổi tác) 50
eyeColor (màu mắt) màu xanh da trời
fullName (họ và tên) function () {return this.firstName + “” + this.lastName;}

Các đối tượng JavaScript là các thùng chứa cho các giá trị được đặt tên, được gọi là các thuộc tính và phương thức.

Tạo một đối tượng JavaScript

Với JavaScript, bạn có thể xác định và tạo các đối tượng của riêng mình.

Có nhiều cách khác nhau để tạo đối tượng mới:

  • Xác định và tạo một đối tượng duy nhất, sử dụng một đối tượng bằng chữ.
  • Xác định và tạo một đối tượng duy nhất, với từ khóa new.
  • Xác định một hàm tạo đối tượng, và sau đó tạo các đối tượng của kiểu có cấu trúc.

Trong ECMAScript 5, một đối tượng cũng có thể được tạo bằng hàm Object.create ().

Sử dụng một đối tượng

Đây là cách dễ nhất để tạo đối tượng JavaScript.

Sử dụng một đối tượng bằng chữ, bạn vừa xác định và tạo một đối tượng trong một câu lệnh.

Một đối tượng bằng chữ là một danh sách các cặp tên: giá trị (như age: 50) bên trong dấu ngoặc nhọn {}.

Ví dụ sau đây tạo một đối tượng JavaScript mới với bốn thuộc tính:

Ví dụ

var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};
<!DOCTYPE html>
<html>
<body>

<p>Creating a JavaScript Object.</p>

<p id="demo"></p>

<script>
var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};

document.getElementById("demo").innerHTML =
person.firstName + " is " + person.age + " years old.";
</script>

</body>
</html>

Khoảng trắng và ngắt dòng không quan trọng. Một định nghĩa đối tượng có thể trải rộng trên nhiều dòng:

Ví dụ

var person = {
firstName: "John",
lastName: "Doe",
age: 50,
eyeColor: "blue"
};
<!DOCTYPE html>
<html>
<body>

<p>Creating a JavaScript Object.</p>

<p id="demo"></p>

<script>
var person = {
firstName : "John",
lastName : "Doe",
age : 50,
eyeColor : "blue"
};

document.getElementById("demo").innerHTML =
person.firstName + " is " + person.age + " years old.";
</script>

</body>
</html>

Sử dụng từ khóa JavaScript new

Ví dụ sau đây cũng tạo một đối tượng JavaScript mới với bốn thuộc tính:

Ví dụ

var person = new Object();
person.firstName = "John";
person.lastName = "Doe";
person.age = 50;
person.eyeColor = "blue";
<!DOCTYPE html>
<html>
<body>

<p id="demo"></p>

<script>
var person = new Object();
person.firstName = "John";
person.lastName = "Doe";
person.age = 50;
person.eyeColor = "blue";

document.getElementById("demo").innerHTML =
person.firstName + " is " + person.age + " years old.";
</script>

</body>
</html>

Hai ví dụ trên làm chính xác như nhau. Không cần sử dụng new Object ().
Để đơn giản, dễ đọc và tốc độ thực thi, hãy sử dụng cái đầu tiên (phương thức nghĩa đen của đối tượng).

Các đối tượng JavaScript có thể thay đổi

Các đối tượng có thể thay đổi: Chúng được giải quyết bằng tham chiếu, không phải theo giá trị.

Nếu person là một đối tượng, câu lệnh sau sẽ không tạo ra một bản sao của person:

var x = person;  // This will not create a copy of person.

Đối tượng x không phải là bản sao của person. Đó  person. Cả x và person là cùng một đối tượng.

Mọi thay đổi đối với x cũng sẽ thay đổi person, vì x và person là cùng một đối tượng.

Ví dụ

var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"}

var x = person;
x.age = 10;           // This will change both x.age and person.age
<!DOCTYPE html>
<html>
<body>

<p>JavaScript objects are mutable.</p>
<p>Any changes to a copy of an object will also change the original.</p>

<p id="demo"></p>

<script>
var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"}

var x = person;
x.age = 10;

document.getElementById("demo").innerHTML =
person.firstName + " is " + person.age + " years old.";
</script>

</body>
</html>

Lưu ý: Các biến JavaScript không thể thay đổi. Chỉ các đối tượng JavaScript.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

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 *