Hướng dẫn chi tiết về cách sử dụng Object trong JavaScript

Giới thiệu

Trong lập trình JavaScript, các đối tượng (Object) là một phần vô cùng quan trọng, giúp lưu trữ dữ liệu và tính năng một cách có cấu trúc. Bài viết này sẽ cung cấp cái nhìn tổng quan về các phương thức phổ biến nhất của Object, giúp các lập trình viên thao tác và quản lý đối tượng một cách hiệu quả.

1. Object.create()

Object.create() được sử dụng để tạo một đối tượng mới, có nguyên mẫu được chỉ định. Điều này cho phép lập trình viên tùy chỉnh hơn so với cách tạo đối tượng truyền thống.

const personPrototype = {
  greet() {
    console.log(`Hello, my name is ${this.name}`);
  }
};

const john = Object.create(personPrototype);
john.name = "John";
john.greet();  // Kết quả: Hello, my name is John

2. Object.assign()

Object.assign() cho phép sao chép các thuộc tính từ một hoặc nhiều đối tượng nguồn sang một đối tượng đích. Nó là một công cụ hữu ích để kết hợp nhiều đối tượng.

const target = { a: 1 };
const source = { b: 2, c: 3 };
const result = Object.assign(target, source);
console.log(result);  // Kết quả: { a: 1, b: 2, c: 3 }

3. Object.keys()

Object.keys() trả về một mảng chứa tên của các thuộc tính có thể liệt kê của một đối tượng, giúp lập trình viên dễ dàng kiểm tra các thuộc tính hiện có.

const obj = { a: 1, b: 2, c: 3 };
console.log(Object.keys(obj));  // Kết quả: ['a', 'b', 'c']

4. Object.values()

Object.values() cung cấp một mảng các giá trị của các thuộc tính có thể liệt kê trong một đối tượng.

const obj = { a: 1, b: 2, c: 3 };
console.log(Object.values(obj));  // Kết quả: [1, 2, 3]

5. Object.entries()

Object.entries() trả về một mảng chứa các cặp khóa và giá trị của một đối tượng.

const obj = { a: 1, b: 2, c: 3 };
console.log(Object.entries(obj));  // Kết quả: [['a', 1], ['b', 2], ['c', 3]]

6. Object.freeze()

Phương thức Object.freeze() giúp đóng băng đối tượng, ngăn cản bất kỳ thay đổi nào đối với thuộc tính của nó.

const obj = { a: 1 };
Object.freeze(obj);
obj.a = 2;  // Không có tác dụng
console.log(obj.a);  // Kết quả: 1

7. Object.seal()

Object.seal() sẽ niêm phong một đối tượng, không cho phép thêm thuộc tính mới nhưng cho phép sửa đổi các thuộc tính hiện có.

const obj = { a: 1 };
Object.seal(obj);
obj.a = 2;  // Được phép
delete obj.a;  // Không được phép
console.log(obj.a);  // Kết quả: 2

8. Object.preventExtensions()

Phương thức Object.preventExtensions() ngăn cản việc thêm thuộc tính mới nhưng cho phép xóa và sửa đổi các thuộc tính hiện đã tồn tại.

const obj = { a: 1 };
Object.preventExtensions(obj);
obj.b = 2;  // Không được phép
console.log(obj.b);  // Kết quả: undefined

9. Object.getPrototypeOf()

Object.getPrototypeOf() cho phép lấy nguyên mẫu (prototype) của một đối tượng.

const obj = {};
const proto = Object.getPrototypeOf(obj);
console.log(proto);  // Kết quả: {} (nguyên mẫu mặc định của Object)

10. Object.setPrototypeOf()

Phương thức Object.setPrototypeOf() cho phép thay đổi nguyên mẫu của một đối tượng.

const proto = { greet() { console.log('Hello!'); } };
const obj = {};
Object.setPrototypeOf(obj, proto);
obj.greet();  // Kết quả: 'Hello!'

11. Object.defineProperty()

Object.defineProperty() cho phép xác định một thuộc tính mới hoặc chỉnh sửa thuộc tính hiện có với các tùy chọn bổ sung.

const obj = {};
Object.defineProperty(obj, 'a', {
  value: 42,
  writable: false,
});
obj.a = 100;  // Không có tác dụng
console.log(obj.a);  // Kết quả: 42

12. Object.defineProperties()

Object.defineProperties() cho phép xác định nhiều thuộc tính cho một đối tượng.

const obj = {};
Object.defineProperties(obj, {
  a: { value: 42, writable: false },
  b: { value: 100, writable: true }
});
console.log(obj.a);  // Kết quả: 42
console.log(obj.b);  // Kết quả: 100

13. Object.getOwnPropertyDescriptor()

Object.getOwnPropertyDescriptor() trả về mô tả cho một thuộc tính cụ thể.

const obj = { a: 1 };
const descriptor = Object.getOwnPropertyDescriptor(obj, 'a');
console.log(descriptor);

14. Object.getOwnPropertyDescriptors()

Object.getOwnPropertyDescriptors() trả về tất cả các mô tả thuộc tính của một đối tượng.

const obj = { a: 1 };
const descriptors = Object.getOwnPropertyDescriptors(obj);
console.log(descriptors);

15. Object.getOwnPropertyNames()

Object.getOwnPropertyNames() trả về một mảng chứa tất cả các thuộc tính của một đối tượng, bao gồm cả thuộc tính không thể liệt kê.

const obj = { a: 1 };
Object.defineProperty(obj, 'b', { value: 2, enumerable: false });
console.log(Object.getOwnPropertyNames(obj));  // Kết quả: ['a', 'b']

16. Object.is()

Phương thức Object.is() được sử dụng để so sánh hai giá trị mà không gặp phải các vấn đề về NaN hoặc -0.

console.log(Object.is(NaN, NaN));  // Kết quả: true
console.log(Object.is(+0, -0));    // Kết quả: false

17. Object.isFrozen()

Object.isFrozen() kiểm tra xem một đối tượng có bị đóng băng hay không.

const obj = Object.freeze({ a: 1 });
console.log(Object.isFrozen(obj));  // Kết quả: true

18. Object.isSealed()

Phương thức Object.isSealed() kiểm tra xem một đối tượng có bị niêm phong hay không.

const obj = Object.seal({ a: 1 });
console.log(Object.isSealed(obj));  // Kết quả: true

19. Object.isExtensible()

Object.isExtensible() kiểm tra xem một đối tượng có thể mở rộng hay không.

const obj = { a: 1 };
Object.preventExtensions(obj);
console.log(Object.isExtensible(obj));  // Kết quả: false

20. Object.fromEntries()

Object.fromEntries() chuyển đổi một mảng các cặp khóa-giá trị thành đối tượng, rất hữu ích cho việc xử lý dữ liệu.

const entries = [['a', 1], ['b', 2]];
const obj = Object.fromEntries(entries);
console.log(obj);  // Kết quả: { a: 1, b: 2 }

21. Object.hasOwnProperty()

Phương thức hasOwnProperty() giúp kiểm tra xem một đối tượng có thuộc tính cụ thể hay không.

const obj = { a: 1 };
console.log(obj.hasOwnProperty('a'));  // Kết quả: true

22. Object.groupBy

Object.groupBy là một tính năng mới đề xuất trong ECMAScript 2024 cho phép nhóm các đối tượng theo tiêu chí cụ thể. Tính năng này chưa hoàn toàn được hỗ trợ rộng rãi trong các trình duyệt và công cụ hiện tại.

const array = [
  { name: 'Alice', age: 25 },
  { name: 'Bob', age: 30 },
  { name: 'Charlie', age: 25 },
  { name: 'David', age: 30 },
];

const groupedByAge = Object.groupBy(array, item => item.age);
console.log(groupedByAge);

Kết luận

Bài viết trên đã điểm qua những phương thức chính của Object trong JavaScript, từ việc tạo đối tượng đến kiểm soát các thuộc tính và nguyên mẫu. Hi vọng rằng các thông tin trong bài viết sẽ giúp bạn trong quá trình làm việc với các đối tượng trong JavaScript. Cảm ơn bạn đã theo dõi bài viết này!
source: viblo