Decorator pattern là gì?

Question

Accepted Answer

Pattern **Decorator** thêm **hành vi hoặc trách nhiệm** vào đối tượng một cách động bằng cách bọc (wrap) chúng — mà không thay đổi class gốc. Nó cung cấp một phương án thay thế linh hoạt cho subclassing để mở rộng chức năng, cho phép bạn kết hợp các hành vi.

## Pattern Decorator làm gì

```text
DECORATOR → BỌC một đối tượng để thêm hành vi, giữ nguyên interface:
  → decorator bọc đối tượng gốc, thêm hành vi của nó, và ủy thác cho đối tượng gốc
  → bạn có thể XẾP CHỒNG các decorator (bọc một đối tượng đã bọc) → kết hợp nhiều hành vi
  → thêm chức năng MÀ KHÔNG sửa class gốc hay dùng subclassing
→ "bọc để mở rộng" — thêm hành vi linh hoạt, có thể kết hợp
```

## Ví dụ

```js
// đối tượng cơ sở
let coffee = { cost: () => 5, description: () => 'coffee' };
// các decorator bọc và thêm hành vi
function withMilk(c) {
  return { cost: () => c.cost() + 1, description: () => c.description() + ' + milk' };
}
function withSugar(c) {
  return { cost: () => c.cost() + 0.5, description: () => c.description() + ' + sugar' };
}
coffee = withSugar(withMilk(coffee));   // xếp chồng các decorator
coffee.cost();          // 6.5 — hành vi đã kết hợp
```

## Lợi ích và ứng dụng

```text
LỢI ÍCH:
  ✓ Thêm hành vi MÀ KHÔNG sửa đối tượng gốc (open/closed) hay bùng nổ subclass
  ✓ KẾT HỢP hành vi linh hoạt tại runtime (xếp chồng các decorator khác nhau theo nhiều cách)
  ✓ Single responsibility → mỗi decorator thêm một thứ
ỨNG DỤNG → I/O stream (bọc các stream), middleware (bọc request handler), UI component,
  thêm tính năng (logging, caching, validation) quanh một đối tượng lõi; HOC trong React
```

## Tại sao điều này quan trọng

Hiểu pattern Decorator là giá trị vì nó là một **structural pattern hữu ích** để mở rộng hành vi linh hoạt, nên đây là kiến thức thiết kế liên quan thực tế.

Pattern Decorator thêm hành vi vào đối tượng bằng cách **bọc chúng** (giữ nguyên interface, ủy thác cho đối tượng gốc trong khi thêm hành vi), mà không sửa class gốc — cung cấp một phương án thay thế linh hoạt cho subclassing.

Hiểu nó làm gì (bọc một đối tượng để thêm hành vi, với khả năng **xếp chồng các decorator** để kết hợp nhiều hành vi) là kiến thức cốt lõi.

Hiểu **các lợi ích** là then chốt: nó thêm hành vi **mà không sửa đối tượng gốc** (tuân theo nguyên tắc open/closed) và tránh **bùng nổ subclass** vốn sẽ xảy ra khi tạo subclass cho mọi tổ hợp tính năng, nó cho phép bạn **kết hợp hành vi linh hoạt tại runtime** (xếp chồng các decorator khác nhau theo nhiều cách), và nó hỗ trợ single responsibility (mỗi decorator thêm một thứ).

Khả năng kết hợp này — xây dựng hành vi bằng cách xếp chồng các decorator nhỏ, tập trung — là điểm mạnh cốt lõi của pattern, linh hoạt hơn nhiều so với subclassing cứng nhắc.

Hiểu **các ứng dụng** — I/O stream (ví dụ kinh điển về việc bọc stream), middleware (bọc request handler — phổ biến trong các web framework), UI component, thêm các tính năng cross-cutting (logging, caching, validation) quanh một đối tượng lõi, và higher-order component của React — làm rõ khả năng áp dụng thực tế rộng của nó.

Pattern Decorator xuất hiện khắp các framework và thư viện thực tế.

Vì pattern Decorator là một structural pattern hữu ích để mở rộng hành vi linh hoạt (bọc để thêm hành vi mà không sửa đối tượng gốc hay bùng nổ subclass, kết hợp hành vi tại runtime), và vì hiểu nó làm gì, các lợi ích, và các ứng dụng phổ biến (stream, middleware, tính năng) là liên quan thực tế, hiểu pattern Decorator là kiến thức thiết kế giá trị, thường áp dụng được — một pattern hữu ích để mở rộng hành vi linh hoạt, có thể kết hợp, xuất hiện khắp các framework thực tế (stream, middleware, HOC), và là kiến thức thiết kế quan trọng để mở rộng chức năng gọn gàng mà không sửa đối tượng gốc hay tạo các phân cấp subclass cứng nhắc.