Đối tượng của JavaScript

Đối tượng, thuộc tính và phương thức trong cuộc sống thực tế

Trong cuộc sống thực tế, xe ô tô là mộtĐối tượng。

Xe ô tô có các thuộc tính như trọng lượng và màu sắc.Thuộc tínhcũng có các phương thức như khởi động và dừng lại.Phương thức：

Đối tượng Thuộc tính Phương thức

car.name = porsche

car.model = 911

car.length = 4499mm

car.color = white

car.start()

car.drive()

car.brake()

car.stop()

Tất cả các xe ô tô đều cóThuộc tínhgiống nhau, nhưng giá trị thuộc tính khác nhau tùy thuộc vào xe.

Tất cả các xe ô tô đều cóPhương thứcnhưng phương thức sẽ được thực hiện vào các thời điểm khác nhau.

Đối tượng của JavaScript

Bạn đã học được rằng biến JavaScript là thùng chứa giá trị dữ liệu.

Mã này gán mộtgiá trị đơn(porsche) được gán cho biến có tênBiến：

var car = "porsche";

Thử trực tiếp

Đối tượng cũng là một biến. Nhưng đối tượng chứa rất nhiều giá trị.

Mã này gángiá trị nhiều(porsche, 911, white) được gán cho biến có tênBiến：

var car = {type:"porsche", model:"911", color:"white"};

Thử trực tiếp

Giá trị đượcTên: Giá trịđược viết dưới dạng đối tượng (tên và giá trị được chia cách bởi dấu hai chấm).

Đối tượng JavaScript làGiá trị được đặt tênmột thùng chứa.

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

（Trong đối tượng JavaScript）Tên: giá trị được gọi làThuộc tính。

var person = {firstName:"Bill", lastName:"Gates", age:62, eyeColor:"blue"};
Thuộc tính Giá trị thuộc tính
firstName Bill
lastName Gates
age 62
eyeColor blue

Phương thức đối tượng

Đối tượng cũng có thể cóPhương thức。

Phương thức được thực hiện trên đối tượngHành động。

Phương thức đượcĐịnh nghĩa hàmđược lưu trữ trong thuộc tính.

Thuộc tính Giá trị thuộc tính
firstName Bill
lastName Gates
age 62
eyeColor blue
fullName function() {return this.firstName + " " + this.lastName;}

Phương thức được lưu trữ như thuộc tính của một hàm.

Mẫu

var person = {
  firstName: "Bill",
  lastName : "Gates",
  id       : 678,
  fullName : function() {
    return this.firstName + " " + this.lastName;
  }
};

từ khóa this

Trong định nghĩa hàmthis tham chiếu đến đối tượng" chủ" của hàm.

Trong ví dụ trênthis chỉ là từ" có "hàm fullName. Đối tượng person。

Nói cách khácthis.firstName ý nghĩa là Đối tượng thisthuộc tính firstName.

Vui lòng ở Từ khóa this của JSChương này học thêm về từ khóa this.

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

Chúng ta đã định nghĩa (tạo) một đối tượng JavaScript:

Mẫu

var person = {firstName:"Bill", lastName:"Gates", age:62, eyeColor:"blue"};

Thử trực tiếp

Khoảng trống và ngắt hàng đều được phép. Định nghĩa đối tượng có thể chạy qua nhiều dòng:

Mẫu

var person = {
    firstName:"Bill",
    lastName:"Gates",
    age:50,
    eyeColor:"blue"
};

Thử trực tiếp

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

Bạn có thể truy cập thuộc tính theo hai cách:

objectName.propertyName

hoặc

objectName["propertyName"]

Ví dụ 1

person.lastName;

Thử trực tiếp

Ví dụ 2

person["lastName"];

Thử trực tiếp

Truy cập phương thức đối tượng

Bạn có thể truy cập phương thức đối tượng theo cú pháp sau:

objectName.methodName())

Mẫu

name = person.fullName();

Thử trực tiếp

Nếu bạnKhông sử dụng () Nếu truy cập phương thức fullName, nó sẽ trả vềĐịnh nghĩa hàm：

Mẫu

name = person.fullName;

Thử trực tiếp

Phương pháp thực chất là định nghĩa hàm được lưu trữ dưới dạng giá trị thuộc tính.

Vui lòng không khai báo chuỗi, số và giá trị boolean dưới dạng đối tượng!

Nếu thông qua từ khóa "new" để khai báo biến JavaScript, biến đó sẽ được tạo thành đối tượng:

var x = new String();        // Đặt x là đối tượng String
var y = new Number();        // Đặt y là đối tượng Number
var z = new Boolean();       //	Đặt z là đối tượng Boolean

Hãy tránh các đối tượng chuỗi, số hoặc logic. Họ sẽ làm tăng độ phức tạp của mã và giảm tốc độ thực thi.

Bạn sẽ học thêm về đối tượng trong các phần sau của hướng dẫn này.

sách giáo khoa ngoài giờ

cần thêm thông tin về Đối tượng của JavaScriptĐể biết thêm về

Kỹ thuật hướng đối tượng ECMAScript
Phần này giới thiệu các thuật ngữ của kỹ thuật hướng đối tượng, yêu cầu của ngôn ngữ hướng đối tượng và cấu tạo của đối tượng.
Ứng dụng đối tượng ECMAScript
Phần này giới thiệu cách khai báo và thực hiện đối tượng, cách tham chiếu và hủy bỏ đối tượng, và khái niệm gắn kết.
Loại đối tượng ECMAScript
Phần này giới thiệu ba loại đối tượng của ECMAScript: đối tượng cục bộ, đối tượng nội bộ và đối tượng chủ nhà, và cung cấp liên kết đến tài liệu tham khảo liên quan.
Phạm vi đối tượng ECMAScript
Phần này giải thích phạm vi đối tượng ECMAScript và từ khóa this.
Định nghĩa lớp hoặc đối tượng ECMAScript
Phần này giải thích chi tiết các cách tạo đối tượng hoặc lớp ECMAScript.
Chỉnh sửa đối tượng ECMAScript
Phần này giải thích cách sửa đổi đối tượng bằng cách tạo phương pháp mới hoặc thay đổi phương pháp đã có.