Using composition, the decorated component is wrapped around a new object that usually inherits from it. The Decorator in this case simply needs to define the new methods, while delegating the existing ones to the original component:

function decorate(component) { 
  const proto = Object.getPrototypeOf(component); 
 
  function Decorator(component) { 
    this.component = component; 
  } 
 
  Decorator.prototype = Object.create(proto); 
 
  //new method 
  Decorator.prototype.greetings = function() { 
    return 'Hi!'; 
  }; 
 
  //delegated method 
  Decorator.prototype.hello = function() { 
    return this.component.hello.apply(this.component, arguments);  
  }; 
 
  return new Decorator(component); 
}

Object decoration can also be achieved by simply attaching new methods directly to the decorated object, as follows:

function decorate(component) { 
  //new method 
  component.greetings = () => { 
    //... 
  }; 
  return component; 
} 

The same caveats discussed during the analysis of the Proxy pattern are also valid for Decorator. Let's now practice the pattern with a working example!

LevelUP (https://npmjs.org/package/levelup) is a Node.js wrapper around Google's LevelDB, a key/value store originally built to implement IndexedDB in the Chrome browser, but it's much more than that. LevelDB has been defined by Dominic Tarr as the "Node.js of databases" because of its minimalism and extensibility. Like Node.js, LevelDB provides blazingly fast performance and only the most basic set of features, allowing developers to build any kind of database on top of it.

The Node.js community, and in this case Rod Vagg, did not miss the chance to bring the power of this database into Node.js by creating LevelUP. Born as a wrapper for LevelDB, it then evolved to support several kinds of backend, from in-memory stores, to other NoSQL databases such as Riak and Redis, to web storage engines such as IndexedDB and localStorage, allowing us to use the same API on both the server and the client, opening up some really interesting scenarios.

Today, there is a fully-fledged ecosystem around LevelUP made of plugins and modules that extend the tiny core to implement features such as replication, secondary indexes, live updates, query engines, and more. Also, complete databases were built on top of LevelUP, including CouchDB clones such as PouchDB (https://npmjs.org/package/pouchdb) and CouchUP (https://npmjs.org/package/couchup), and even a graph database, levelgraph (https://npmjs.org/package/levelgraph), which can work both on Node.js and the browser!

In the next example, we are going to show how we can create a simple plugin for LevelUP using the Decorator pattern, and in particular, the object augmentation technique, which is the simplest but nevertheless the most pragmatic and effective way to decorate objects with additional capabilities.

What we want to build is a plugin for LevelUP that allows us to receive notifications every time an object with a certain pattern is saved into the database. For example, if we subscribe to a pattern such as {a: 1}, we want to receive a notification when objects such as {a: 1, b: 3} or {a: 1, c: 'x'} are saved into the database.

Let's start to build our small plugin by creating a new module called levelSubscribe.js. We will then insert the following code:

module.exports = function levelSubscribe(db) { 
 
  db.subscribe = (pattern, listener) => {        //[1] 
    db.on('put', (key, val) => {                 //[2] 
      const match = Object.keys(pattern).every( 
        k => (pattern[k] === val[k])             //[3] 
      ); 
      if(match) { 
        listener(key, val);                      //[4] 
      } 
    }); 
  }; 
 
  return db; 
}; 

That's it for our plugin, it's extremely simple. Let's briefly see what happens in the preceding code:

Let's now create some code—in a new file named levelSubscribeTest.js—to try out our new plugin:

const level = require('level');                              //[1] 
const levelSubscribe = require('./levelSubscribe');          //[2] 
 
let db = level(__dirname + '/db', {valueEncoding: 'json'}); 
db = levelSubscribe(db); 
 
db.subscribe( 
  {doctype: 'tweet', language: 'en'},                        //[3] 
  (k, val) => console.log(val)  
); 
db.put('1', {doctype: 'tweet', text: 'Hi', language: 'en'}); //[4] 
db.put('2', {doctype: 'company', name: 'ACME Co.'}); 

This is what we did in the preceding code:

This example shows a real application of the decorator pattern in its simplest implementation: object augmentation. It might look like a trivial pattern, but it has undoubted power if used appropriately.