Author Box
Articles Categories
All Categories
Articles Resources

Chain of Responsibility JavaScript Design Pattern

February 21, 2012 | Comments: 0 | Views: 146

Today, we'll be talking about the Chain of Responsibility Pattern. This pattern decouples the sender and receiver of requests. This is done with a chain of objects that can each handle the request itself or pass it on to the next object. Confused? Read on.

Chain of Responsibility Structure

3 parts make up the Chain of Responsibility pattern: sender, receiver, and request. The sender makes requests. The receiver is a chain of 1 or more objects that choose whether to handle the request or pass it on. The request itself can be an object that encapsulates all the appropriate data, or it could just be a normal function call on the receiver with no arguments.

Senders send the request to the first receiver object in the chain. The sender only knows about this first part of the chain and nothing about the other receivers. The first receiver either handles the request or passes it on to the next receiver in the chain. Each receiver only knows about the next receiver in the line. The request will continue down the line until the request was handled or there are no more receivers to pass it on to, at which point either an error is thrown or nothing happens, depending on how you design your chain.

Chain of Responsibility Example

For our example, we'll be creating an ATM. The chain is going to consist of different sized dollar bills. When you ask for some cash, the machine starts at the larger bills and pulls out as many of those that it needs, then moves on to the next smaller bill and so on until we've got all of the money or we run out of bills. This example is purposefully simple, because that helps to show the concept more clearly without diluting the code with too many example-specific implementations.

We'll start by creating the receiver 'class': MoneyStacks. Normally this would just be an interface that would be implemented by different receivers, but this example is simple enough that the only variance between each of the receivers will be the size of the bills in the stack. We'll just set that number via a parameter in the constructor.

var MoneyStack = function(billSize) { this.billSize = billSize; = null; } MoneyStack.prototype = { withdraw: function(amount) { var numOfBills = Math.floor(amount / this.billSize);

if (numOfBills > 0) { // Eject the bills this._ejectMoney(numOfBill); // Shrink the amount by how much money we ejected amount = amount - (this.billSize * numOfBills); }

// If there is any money left to withdraw and if we have // another stack in the line, pass the request on amount > 0 && &&; }, // set the stack that comes next in the chain setNextStack: function(stack) { = stack; }, // private method that ejects the money _ejectMoney(numOfBills) { console.log(numOfBills + " $" + this.billSize+ " bill(s) has/have been spit out"); } }

The math behind it is pretty simple. The withdraw function is what uses the chaining ability by ejecting the required bills and then passing the request on to the next in the chain when appropriate.

Now, we'll build the ATM. Its constructor instantiates all of the money stacks and puts them into their hierarchical order. When someone calls the withdraw method on it, it the responsibility of withdrawing gets passed on to the chain of money stacks.

var ATM = function() { // Create the stacks of money // We'll show you the implementation for this next var stack100 = new MoneyStack(100), stack50 = new MoneyStack(50), stack20 = new MoneyStack(20), stack10 = new MoneyStack(10), stack5 = new MoneyStack(5), stack1 = new MoneyStack(1);

// Set the hierarchy for the stacks stack100.setNextStack(stack50); stack50.setNextStack(stack20); stack20.setNextStack(stack10); stack10.setNextStack(stack5); stack5.setNextStack(stack1);

// Set the top stack as a property this.moneyStacks = stack100; }

ATM.prototype.withdraw = function(amount) { this.moneyStacks.withdraw(amount); }

// USAGE var atm = new ATM(); atm.withdraw(186); /* outputs: 1 $100 bill(s) has/have been spit out 1 $50 bill(s) has/have been spit out 1 $20 bill(s) has/have been spit out 1 $10 bill(s) has/have been spit out 1 $5 bill(s) has/have been spit out 1 $1 bill(s) has/have been spit out */ atm.withdraw(72); /* outputs: 1 $50 bill(s) has/have been spit out 1 $20 bill(s) has/have been spit out 2 $1 bill(s) has/have been spit out */

Ending My Responsibilities

That's all there is to this pattern. It's pretty simple. Like the Command and Observer patterns, its purpose is to decouple the sender from the receivers but for different reasons and with different trade-offs. Due to its hierarchical structure, it's also similar to the Composite pattern, and can even be injected within the Composite pattern for some real fun.

Joe Zim I've been programming with HTML, CSS, and JavaScript since I was 12 years old and I think JavaScript has won out against the other two to become my favorite language. I now maintain a JavaScript blog at that I update twice a week while I work from home for an internet marketing company.

Source: EzineArticles
Was this Helpful ?

Rate this Article

Article Tags:

Design Pattern




Chain Of Responsibility




Web Development

Windows 8 will change the way you work and play, says Microsoft and we agree. Nearly all of the previous iterations of the Windows OS have been evolutionary but Windows 8 is set to change all that.

By: Sakshi Sharma l Computers & Technology > Mobile Computing l April 03, 2013 lViews: 662

Many antivirus programs available today have various features but it entirely depends on the user to make the best choice from among these different computer virus protection programs online. Before

By: Alex l Computers & Technology > Software l December 28, 2012 lViews: 370

You can add a new color to your entertainment life with iskysoft video converter for mac & iskysoft dvd creator for mac and make your Christmas holidays all the more special. iskysoft video

By: Zaithyn Galter l Computers & Technology > Software l December 23, 2012 lViews: 1070

The choices you make regarding the type of recruiting software you choose to use are important. Being an informed consumer is essential to getting a system or components that complement systems of

By: Maria Warne l Computers & Technology > Software l December 14, 2012 lViews: 306

The Cisco certification has become the most popular IT training in recent days and it offers three different levels of these certifications include as: associate, professional and expert-level.

By: sandidas chakma l Computers & Technology > Certification Tests l December 11, 2012 lViews: 237

Millions of prospective 12th standard students are gearing up their preparations for the Joint Entrance Exam for engineering seats. From 2013, it has been decided by the IITs, CBSE, JEE organizing

By: Sarkariexam l Computers & Technology > Certification Tests l December 07, 2012 lViews: 633

Sunny Ghosh, Director, Wolf Frameworks, once commented "The end of Fashion IT -customers will only pay for value and not technology... With the advent of Web 3.0 or Cloud Computing or platforms..,

By: Camrone Whitel Computers & Technology > Programmingl June 15, 2012 lViews: 164

The other day, I met an individual at Starbucks, an artist amongst other things. He seemed incredibly good at the art of doodling and turning those sketches into art work - the stuff he showed me was

By: Lance Winslowl Computers & Technology > Programmingl June 15, 2012 lViews: 212

Following is a brief outline of the future of WordPress. It talks about the developments, problems and solutions that this segment is facing. WordPress has seen growth like no other in the Content

By: James J. Johnl Computers & Technology > Programmingl June 14, 2012 lViews: 174

Data Warehouse analyses the data, stores them and streamlines the information in the respective systems. This increases the efficiency of the organization and benefits the overall performance of the

By: Sam Mackenziel Computers & Technology > Programmingl June 13, 2012 lViews: 184

One of my favorite topics is artificial intelligence. In fact, I do believe in the future that the CEOs of every major corporation will actually be a supercomputer with artificially intelligent

By: Lance Winslowl Computers & Technology > Programmingl June 13, 2012 lViews: 185

Mobile strategy has evolved as an integrated part of marketing strategy irrespective of the industry vertical. With the smart phones percolating heavily in the Indian market, it is all the more

By: Ponting Smithl Computers & Technology > Programmingl June 12, 2012 lViews: 192