JavaScript - Đối tượng: Hướng dẫn cho người mới bắt đầu

Xin chào các bạn đang học lập trình! Tôi rất vui mừng được làm hướng dẫn viên của bạn trong hành trình thú vị vào thế giới của các đối tượng JavaScript. Là người đã dạy lập trình trong nhiều năm, tôi có thể nói rằng việc hiểu các đối tượng là như解锁 một siêu năng lực bí mật trong JavaScript. Hãy cùng khám phá nào!

Những gì là các đối tượng JavaScript?

Hãy tưởng tượng bạn đang mô tả chú chó của bạn. Bạn có thể nói rằng nó có tên, tuổi, giống và món đồ chơi yêu thích. Trong JavaScript, chúng ta có thể đại diện cho chú chó này dưới dạng một đối tượng, với tất cả các đặc điểm này là các thuộc tính của nó. Hãy tạo đối tượng đầu tiên của chúng ta:

let myDog = {
name: "Buddy",
age: 3,
breed: "Golden Retriever",
favoriteToy: "quả bóng kêu"
};

Đây là gì chúng ta gọi là đối tượng văn bản. Nó giống như một容器 chứa thông tin liên quan. Mỗi mảnh thông tin là một thuộc tính, với một tên (như "name" hoặc "age") và một giá trị ("Buddy" hoặc 3).

Các thuộc tính của đối tượng

Bây giờ chúng ta đã có đối tượng myDog, làm thế nào để chúng ta truy cập các thuộc tính của nó? Có hai cách:

1. Ký hiệu chấm:

   console.log(myDog.name); // Xuất: Buddy

2. Ký hiệuBracket:

   console.log(myDog["age"]); // Xuất: 3

Cả hai đều làm cùng một việc, nhưng ký hiệuBracket tiện lợi khi tên thuộc tính được lưu trữ trong một biến hoặc có khoảng trắng.

Chúng ta cũng có thể thêm các thuộc tính mới vào đối tượng của mình:

myDog.isGoodBoy = true;
console.log(myDog.isGoodBoy); // Xuất: true

Hoặc thay đổi các thuộc tính hiện có:

myDog.age = 4;
console.log(myDog.age); // Xuất: 4

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

Phương thức là các hàm thuộc về một đối tượng. Chúng giống như các hành động mà đối tượng của chúng ta có thể thực hiện. Hãy thêm một phương thức vào đối tượng myDog của chúng ta:

myDog.bark = function() {
console.log("Woof woof!");
};

myDog.bark(); // Xuất: Woof woof!

Bây giờ chú chó của chúng ta có thể sủa! Có phải không tuyệt vời không?

Tạo các đối tượng mới

Chúng ta đã thấy cách tạo đối tượng sử dụng văn bản đối tượng, nhưng còn một cách khác sử dụng bộ tạo Object():

let myCat = new Object();
myCat.name = "Whiskers";
myCat.age = 5;
myCat.meow = function() {
console.log("Meow!");
};

myCat.meow(); // Xuất: Meow!

Phương pháp này ít phổ biến hơn, nhưng biết nó tồn tại là điều tốt.

Định nghĩa các phương thức cho một đối tượng

Chúng ta có thể định nghĩa các phương thức khi tạo đối tượng, giống như chúng ta đã làm với các thuộc tính:

let myParrot = {
name: "Polly",
age: 2,
speak: function() {
console.log("Polly wants a cracker!");
}
};

myParrot.speak(); // Xuất: Polly wants a cracker!

Cũng có một cách viết ngắn gọn hơn để định nghĩa các phương thức:

let myHamster = {
name: "Fuzzy",
age: 1,
run() {
console.log("Running on the wheel!");
}
};

myHamster.run(); // Xuất: Running on the wheel!

Từ khóa 'with'

Từ khóa with có thể làm cho mã của bạn ngắn hơn khi bạn làm việc với các thuộc tính của cùng một đối tượng nhiều lần:

with(myDog) {
console.log(name);
console.log(age);
bark();
}

Tuy nhiên, hãy cẩn thận với with vì nó có thể làm cho mã của bạn không rõ ràng và không được khuyến khích trong chế độ nghiêm ngặt.

Các đối tượng gốc JavaScript

JavaScript có nhiều đối tượng内置 sẵn cung cấp các chức năng hữu ích. Dưới đây là một số phổ biến nhất:

Đối tượng	Mô tả
String	Đại diện và manipulates văn bản
Number	Đại diện cho các giá trị số
Boolean	Đại diện cho các giá trị true/false
Array	Đại diện cho một danh sách các giá trị
Math	Cung cấp các phép toán số học
Date	Đại diện cho các ngày và thời gian

Hãy xem một số ví dụ:

let greeting = "Hello, World!";
console.log(greeting.length); // Xuất: 13

let pi = Math.PI;
console.log(pi); // Xuất: 3.141592653589793

let today = new Date();
console.log(today); // Xuất: ngày và thời gian hiện tại

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

Các đối tượng trong JavaScript đi kèm với một số phương thức内置 sẵn. Dưới đây là một số quan trọng:

Phương thức	Mô tả
Object.keys()	Trả về một mảng các tên thuộc tính của đối tượng
Object.values()	Trả về một mảng các giá trị thuộc tính của đối tượng
Object.entries()	Trả về một mảng các cặp [key, value] của đối tượng
Object.assign()	Sao chép các thuộc tính từ một đối tượng sang đối tượng khác

Hãy xem chúng trong hành động:

let keys = Object.keys(myDog);
console.log(keys); // Xuất: ["name", "age", "breed", "favoriteToy", "isGoodBoy", "bark"]

let values = Object.values(myDog);
console.log(values); // Xuất: ["Buddy", 4, "Golden Retriever", "squeaky ball", true, ƒ]

let entries = Object.entries(myDog);
console.log(entries); // Xuất: [["name", "Buddy"], ["age", 4], ...]

let newDog = Object.assign({}, myDog);
console.log(newDog); // Xuất: một bản sao của myDog

Và thế là bạn đã bước những bước đầu tiên vào thế giới của các đối tượng JavaScript. Nhớ rằng, thực hành làm cho hoàn hảo, vì vậy đừng ngần ngại thử nghiệm với việc tạo ra các đối tượng và phương thức của riêng bạn. Trước khi bạn biết điều đó, bạn sẽ thành thạo việc sử dụng các đối tượng như một nhà lập trình chuyên nghiệp!

Chúc các bạn lập trình vui vẻ và các đối tượng của bạn luôn không có lỗi!

Credits: Image by storyset