Với tính linh hoạt và đa dạng, Object giúp cho việc lưu trữ và quản lý dữ liệu trở nên dễ dàng và tiện lợi hơn bao giờ hết. Trong bài viết này, chúng ta sẽ cùng tìm hiểu về kiểu dữ liệu object trong JavaScript, cách khai báo, truy cập và thay đổi giá trị thuộc tính của Object, cũng như những tính năng đặc biệt của Object trong JavaScript.

 

1. Giới thiệu

Object là một kiểu dữ liệu trong JavaScript, nó có thể coi là một tập hợp các cặp key-value, trong đó key là một chuỗi hoặc một số và value là bất kỳ giá trị nào (số, chuỗi, mảng, object, ...). Object có thể được sử dụng để biểu diễn dữ liệu có cấu trúc nhiều tầng, và các thuộc tính của object có thể được truy xuất và thay đổi bằng các cặp dấu [] hoặc dấu . (dot notation).

Ví dụ: 

let person = {
  name: "John Doe",
  age: 30,
  address: {
    street: "123 Main St",
    city: "San Francisco",
    state: "CA"
  }
};

console.log(person.name); // "John Doe"
console.log(person["age"]); // 30
console.log(person.address.city); // "San Francisco"

2. Cách tạo, khai báo một object

Có 2 cách để khai báo một object trong JavaScript:

Cách 1: Object Literal: Sử dụng cặp ngoặc nhọn {} để tạo một object và các thuộc tính của object được viết trong dấu hai chấm (:).

Ví dụ:

let person = {
  name: 'John',
  age: 30,
  job: 'developer'
};

Cách 2: Sử dụng constructor Object: Sử dụng từ khóa new và gọi đến constructor Object để tạo một object.

Ví dụ:

let person = new Object();
person.name = 'John';
person.age = 30;
person.job = 'developer';

3. Cách truy cập vào thuộc tính của object

Có 2 cách truy cập vào thuộc tính của object trong JavaScript:

Cách 1: Sử dụng toán tử "." (dot operator): Để truy cập vào thuộc tính của object, ta sử dụng toán tử "." và tên của thuộc tính.

Ví dụ:

let person = {
  name: "John Doe",
  age: 30,
  address: "123 Main St"
};

console.log(person.name); // "John Doe"
console.log(person.age); // 30
console.log(person.address); // "123 Main St"

Cách 2: Sử dụng toán tử "[]" (bracket operator): Để truy cập vào thuộc tính của object, ta có thể sử dụng toán tử "[]" và chuỗi tên của thuộc tính.

Ví dụ:

let person = {
  name: "John Doe",
  age: 30,
  address: "123 Main St"
};

console.log(person["name"]); // "John Doe"
console.log(person["age"]); // 30
console.log(person["address"]); // "123 Main St"

4. Cách thay đổi giá trị của thuộc tính trong object.

Bạn có thể thay đổi giá trị của thuộc tính trong object bằng cách gán giá trị mới cho thuộc tính đó. Có 3 cách:

Ví dụ, giả sử bạn có một object như sau:

let person = {
  name: 'John',
  age: 30,
  city: 'New York'
};

Để thay đổi giá trị của thuộc tính age thành 35, bạn có thể làm như sau:

Cách 1: 

person.age = 35;

Sau khi thực hiện đoạn code trên, giá trị của thuộc tính age trong object person sẽ là 35. Bạn có thể console.log() ra để xem thử.

console.log(person.age) // output: 35

Cách 2:

person['age'] = 31;
console.log(person.age); // output: 31

Cách 3:

Object.assign(person, { age: 25 });
console.log(person.age); // output: 25

5. Các tính năng đặc biệt của object trong JavaScript

 

a. Kiểu dữ liệu của thuộc tính

Một thuộc tính của object có thể chứa bất kỳ kiểu dữ liệu nào, bao gồm các kiểu nguyên thủy (number, string, boolean, null, undefined) và cả các kiểu dữ liệu phức tạp như mảng (array), object khác, hoặc cả function.

Ví dụ:

// Khai báo một object person với các thuộc tính
// name là string, age là number, isStudent là boolean, hobbies là một array và sayHello là một function
const person = {
  name: 'John Doe',
  age: 30,
  isStudent: false,
  hobbies: ['reading', 'traveling', 'hiking'],
  sayHello: function() {
    console.log(`Hello, my name is ${this.name}`);
  }
};

Trong ví dụ này, ta thấy rõ mỗi thuộc tính của object person có thể chứa các kiểu dữ liệu khác nhau, bao gồm kiểu dữ liệu nguyên thủy, mảng, object khác và function.

 

b. Dễ dàng mở rộng và chỉnh sửa

Trong JavaScript, ta có thể thêm hoặc xoá thuộc tính của object bất cứ lúc nào. Điều này cho phép ta mở rộng object dễ dàng hơn trong quá trình phát triển ứng dụng.

Ví dụ, ta có một object person mô tả thông tin của một người bao gồm name, age và address. Ta muốn thêm thuộc tính phoneNumber cho object này:

let person = {
  name: "John Doe",
  age: 30,
  address: "123 Main St"
};

person.phoneNumber = "555-1234";

console.log(person);
// Output: { name: "John Doe", age: 30, address: "123 Main St", phoneNumber: "555-1234" }

Ta có thể thấy, ta đã thêm thành công thuộc tính phoneNumber cho object person.

 

c. Có thể lưu trữ nhiều giá trị cùng một lúc với nhiều khóa khác nhau

Một object có thể chứa nhiều thuộc tính, mỗi thuộc tính được đặt tên bởi một khóa duy nhất. Vì vậy, chúng ta có thể sử dụng object để lưu trữ nhiều giá trị khác nhau cùng một lúc, với mỗi giá trị được đặt trong một thuộc tính khác nhau.

Ví dụ về cách sử dụng object để lưu trữ nhiều giá trị khác nhau:

const student = {
  name: "John",
  age: 25,
  major: "Computer Science",
  courses: ["Programming", "Database", "Networking"]
};

Trong ví dụ này, chúng ta tạo một object có tên là "student", chứa nhiều thuộc tính khác nhau, bao gồm tên, tuổi, ngành học và danh sách các khóa học đang học. Mỗi thuộc tính của object được đặt tên bằng một khóa duy nhất, ví dụ như "name", "age", "major", "courses". Bằng cách này, chúng ta có thể lưu trữ và truy cập các giá trị khác nhau của học sinh trong một đối tượng duy nhất.