Apakah corak Decorator?

Question

Accepted Answer

Corak **Decorator** menambah **tingkah laku atau tanggungjawab** kepada objek secara dinamik dengan membalutnya (wrapping) — tanpa mengubah kelas asal. Ia menyediakan alternatif yang fleksibel kepada subclassing untuk memperluas fungsi, membolehkan anda menggubah tingkah laku.

## Apa yang dilakukan corak Decorator

```text
DECORATOR → WRAP an object to add behavior, keeping the same interface:
  → the decorator wraps the original, adds its behavior, and delegates to the original
  → you can STACK decorators (wrap a wrapped object) → compose multiple behaviors
  → adds functionality WITHOUT modifying the original class or using subclassing
→ "wrap to extend" — flexible, composable behavior addition
```

## Contoh

```js
// base object
let coffee = { cost: () => 5, description: () => 'coffee' };
// decorators wrap and add behavior
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));   // stack decorators
coffee.cost();          // 6.5 — composed behavior
```

## Manfaat dan penggunaan

```text
BENEFITS:
  ✓ Add behavior WITHOUT modifying the original (open/closed) or subclass explosion
  ✓ COMPOSE behaviors flexibly at runtime (stack different decorators in combinations)
  ✓ Single responsibility → each decorator adds one thing
USES → I/O streams (wrapping streams), middleware (wrap request handlers), UI components,
  adding features (logging, caching, validation) around a core object; HOC in React
```

## Mengapa ia penting

Memahami corak Decorator adalah bernilai kerana ia merupakan **corak structural yang berguna** untuk memperluas tingkah laku secara fleksibel, jadi ia pengetahuan reka bentuk yang relevan secara praktikal.

Corak Decorator menambah tingkah laku kepada objek dengan **membalutnya** (mengekalkan interface yang sama, mewakilkan kepada objek asal sambil menambah tingkah laku), tanpa mengubah kelas asal — menyediakan alternatif yang fleksibel kepada subclassing.

Memahami apa yang dilakukannya (membalut objek untuk menambah tingkah laku, dengan keupayaan untuk **menyusun (stack) decorators** bagi menggubah berbilang tingkah laku) ialah pengetahuan teras.

Memahami **manfaat** adalah penting: ia menambah tingkah laku **tanpa mengubah objek asal** (mengikut prinsip open/closed) dan mengelakkan **letupan subkelas** yang akan timbul daripada mencipta subkelas untuk setiap kombinasi ciri, ia membolehkan anda **menggubah tingkah laku secara fleksibel pada masa jalan** (menyusun decorators yang berbeza dalam pelbagai kombinasi), dan ia menyokong single responsibility (setiap decorator menambah satu perkara).

Kebolehgubahan ini — membina tingkah laku dengan menyusun decorators yang kecil dan fokus — merupakan kekuatan utama corak ini, jauh lebih fleksibel berbanding subclassing yang kaku.

Memahami **penggunaan** — I/O streams (contoh klasik membalut streams), middleware (membalut request handlers — biasa dalam framework web), komponen UI, menambah ciri merentas potong (logging, caching, validation) di sekeliling objek teras, dan higher-order components React — menjelaskan keterterapan dunia nyatanya yang luas.

Corak Decorator muncul di seluruh framework dan pustaka sebenar.

Memandangkan corak Decorator ialah corak structural yang berguna untuk memperluas tingkah laku secara fleksibel (membalut untuk menambah tingkah laku tanpa mengubah objek asal atau letupan subkelas, menggubah tingkah laku pada masa jalan), dan kerana memahami apa yang dilakukannya, manfaatnya, serta penggunaan biasanya (streams, middleware, ciri) adalah relevan secara praktikal, memahami corak Decorator merupakan pengetahuan reka bentuk yang bernilai dan lazim boleh diterapkan — corak yang berguna untuk perluasan tingkah laku yang fleksibel dan boleh digubah, muncul di seluruh framework sebenar (streams, middleware, HOCs), serta pengetahuan reka bentuk penting untuk memperluas fungsi dengan kemas tanpa mengubah objek asal atau mencipta hierarki subkelas yang kaku.