Facade design pattern is a structural design pattern. Word facade means 'a deceptive outward appearance'. As facade design pattern hides all the complexities of one or many sub-systems and provides a clean, easy to use facade interface.
We can create multiple Facade interfaces by grouping relevant sub-system in particular class. The client will communicate these facades instead of complex individual subsystems.
Facade Design Pattern - Class Diagram
Implementation
Let's implement a facade pattern on an e-commerce site. We are going to create an online shopping system in which user selects an item from a catalog and place an order. Let's see its code
public class Inventory
{
public bool IsItemAvailable(String itemId)
{
return "Item details";
}
}
public class Payment
{
public String Pay(String itemId,Paypal paypal)
{
return "Charge for items";
}
}
public class Shipping
{
public String ShipOrder(String itemId,Address shipmentAddress)
{
return "Ship items to address";
}
}
public class OrderFacade
{
// composed of all Order related sub-systems
Payment _Payment;
Inventory _Inventory;
Inventory _Shipping;
public void OrderFacade()
{
_Payment = new Payment();
_Inventory = new Inventory();
_Shipping = new Shipping();
}
public void PlaceOrder(String itemId,string creditCard,string shipmentAddress)
{
// check if item is available
if(!_Inventory.IsItemAvailable(itemId)) return "Item Not Available";
// charge for item price
_Payment.Pay(itemId, new Paypal(creditCard));
// ship order to customer
_Shipping.ShipOrder(itemId,shipmentAddress)
}
}
public class Client
{
public static void main()
{
OrderFacade orderFacade = new OrderFacade();
orderFacade.PlaceOrder("1234", "321546", "23-B Frim Road, Moscow");
}
}
As you have seen OrderFacade has encapsulated all the order-related activities and now client just has single point to communicate instead of invoking each sub-system individually. OrderFacade will delegate relevant sub-system and will complete the client request.
Facade pattern provides an interface which is easy to use for a client by hiding many interfaces. This pattern is actually straightforward but it is quite powerful. It allows us to make our system loosely coupled. There is a design principle Least Knowledge which guide us to have fewer dependencies between objects which mean objects should not be tightly coupled otherwise it would be difficult to manage.
Using Facade pattern as we know we have an interface which is responsible for communicating between the objects so it actually allows us to have fewer dependencies within objects. It has many advantages for instance in our example of online shopping system if our payment system is completely independent we can easily change it anytime without affecting the client.
Conclusion
Facade design pattern is a structural pattern which makes design easy by allowing to make a system less tightly coupled and provide an interface to the client which is clean and easy to use by hiding all complexities of sub-systems.
Adapter pattern works as a bridge between two separate objects. It converts interface of a class into another interface which is required. Adapter pattern lets different classes work together that could not otherwise due to the different interface of each class.
Understanding Adapter pattern is not that difficult because it works same as we see an adapter in the real world. The simplest example is AC power adapter which we use for cell-phone, laptop chargers. Electricity at home socket is 220 volts (or 110 volts) but our cell phone needs 5-12 volts so we need an adapter which should convert the power to required range.
Adapter in Programming
Let's see a real world example for Adapter pattern. Information sharing system's team is working on a system which uses social networks sites to share the content. The team has designed an interface which is implemented by Facebook, Twitter, and Linkedin classes. The system is using this interface to switch between these sites and share the content. Developers have to spend a lot of time in implementing these network site's public APIs in these classes and make system bug free and tested.
Here is code implementation of the system.
public interface ISocialNetworks
{
bool Login(string username, string password);
bool Share(string content);
}
public class Facebook: ISocialNetworks
{
public bool Login(string username, string password)
{
//Login Using Facebook API
}
public bool Share(string content)
{
//Share Using Facebook API
}
}
public class Twitter: ISocialNetworks
{
public bool Login(string username, string password)
{
//Login Using Twitter API
}
public bool Share(string content)
{
//Share Using Twitter API
}
}
//similarly for Linkedin
Everything was working fine until client wanted Google+ also in the list and team know to implement the same interface you have to understand APIs and have to put a huge effort in implementations. But you found that Google+ has already developed a library so you downloaded that library and try to integrate into your system.
There is a little problem Google+ developers have implemented their own interface which is not compatible with our information sharing system. Here is the code:
public interface IGoogleSocialNetworks
{
bool Authenticate(string username, string password);
bool Post(string content);
}
public class GooglePlus: IGoogleSocialNetworks
{
public bool Authenticate(string username, string password)
{
//Login Using Google API
}
public bool Post(string content)
{
//Share Using Google API
}
}
Now here comes the adapter which will convert interface of Google+ library to the interface of desired system interface i.e, ISocialNetworks. Let's see its code implementation
public class GoogleNetworksAdapter: ISocialNetworks
{
GooglePlus GoogleLibrary;
public void GoogleNetworksAdapter (GooglePlus googleLibrary)
{
this.GoogleLibrary = googleLibrary;
}
public bool Login(string username, string password)
{
GoogleLibrary.Authenticate(username, password);
}
public bool Share(string content)
{
GoogleLibrary.Post(content);
}
}
Let see design diagram after implementing adapter pattern
Now since Google+ adapter has the same interface as our other Social Networks i.e, ISocialNetworks so it can be use in system easily. Here is how client uses the adapter:
Client make a request to Adapter class (GoogleAdapter) for a method of target interface (ISocialNetworks) e.g, Login
Adapter class translate that request to adapted object method (IGoogleSocialNetwoks) e,g, Authenticate and return response
Client receive the response without realizing that Adapter converted its request to another form.
Here is the class diagram of Adapter Pattern
Adapter pattern uses other good practices of Object Oriented for example object composition in Adapter class to wrap adapted functionalities in target interface. Another advantage of using this object composition is that this adapter can be used with any child class that inherits this Adapted class.
Special Scenario
We have seen a simple example in which all the methods of target interface were available in adapted class. What if there is a method in target interface which is not available in adapted class? In that case adapter pattern is not perfect to use because we have to throw a NotImplementedException. So the client will have to watch out for possible exceptions from the adapter class. The Adapter class should be well documented to reduce the chance of leaving unhandled exception at the client end.
Decorator Pattern is a design Pattern that allows to dynamically add behavior to an existing individual object without making any code changes to the underlying classes. It is a flexible replacement to sub-classing for extending functionality to an object.
If you think inheritance is everything than decorator pattern helps you to learn the power of extension at run-time instead of compile-time. Let's try to learn and implement decorator pattern on a problem.
Decorator Pattern in Pizza Corner Problem
Pizza Corner growing restaurant chain around. Because they have grown, they’re trying to update their ordering systems to match their Pizza offerings. While starting their business they created their classes like this.
Pizza Corner order system's classes design
Other than regular Pizza, you can ask for several pizza topping options like Bacon, Black olives, Chicken, Extra cheese, Mushrooms, Onions, Sausage and much more. Pizza Corner charges for each of these topping, so they want to add these into their system.
First Implementation
First implementation of adding new abilities in system team created a child class for each pizza with each topping option. So first implementation looks like.
If your first thought was also to use inheritance for this problem then you are incorrect. What if Pizza Corner started offering more toppings or added new pizza type you have to add all combination of classes in a system which will become hard to manage.
Alternate Solution
Developer team realize that this subclassed solution is not going to work and its actually a bad design so they started redesigning the system. Now they created instance variables for each topping option in the base class. So each child class can set options which it required.
This solution reduced the size of classes but there is another problem if you have noticed now all the classes has all the topping options so Vegie can also have chicken topping which should not be allowed. Additionally, this design also violate the basic design principle of "Classes should be open for an extension, but closed for modification." As whenever a new topping option will be introduced we need to modify our base class which is not correct.
Decorator Pattern
As we have seen different approaches for our problem at Pizza Corner which have not work out very well. Let's implement Decorator Pattern in this problem.
For decorator pattern we take our pizza type object and than decorate it with different toppings. Lets say we got an order for BBQChicken with Onions, ExtraCheese and Mushrooms.
First take a BBQChicken object
Decorate it with Onions
Decorate it with ExtraCheese
Decorate it with Mushrooms
Call the cost() method and delegation will add cost of all topping and pizza
Decorator Pattern - Decorating Objects
Here are some key points for decorator pattern implementations:
Decorators object should have the same base type as the objects they are decorating.
We can use more than one decorators to wrap an object.
Given that the decorator has the same supertype as the object it decorates, we can pass around a decorated object in place of the original (wrapped) object.
The decorator object apply its own behavior either after or/and before delegating to the object it decorates.
We can decorate objects dynamically at runtime with as many decorator as we required.
Code Implementation
Here is a diagram which shows the design of decorator pattern. We have to implement this design for our system. I am going to implement it in C# language.
Decorator Pattern - Image from Head First Design Pattern
Our base class of Pizza which will be inherited by all pizza types and toppings.
public abstract class Pizza
{
String description = “Unknown Pizza”;
public String getDescription()
{
return description;
}
public abstract double cost();
}
Here are our concrete components classes for each pizza type. Each concrete components will set is own definition for cost method and set description.
public class BBQChicken : Pizza
{
public BBQChicken()
{
description = “BBQ Chicken”;
}
public double cost()
{
return 800; //rupees
}
}
public class HotChickenWings: Pizza
{
public HotChickenWings ()
{
description = “Hot Chicken Wings”;
}
public double cost()
{
return 750; //rupees
}
}
public class Vegie : Pizza
{
public Vegie()
{
description = “Vegetable Pizza”;
}
public double cost()
{
return 650; //rupees
}
}
Let implement topping decorator abstract class:
public abstract class ToppingDecorator : Pizza
{
public abstract String getDescription();
}
We have implemented our base topping decorator class, lets implement decorator class.
public class Onions : ToppingDecorator // ToppingDecorator inherit Pizza
{
Pizza pizza;
public Onions(Pizza pizza)
{
this.pizza = pizza;
}
public String getDescription()
{
return pizza.getDescription() + “, Onions”;
}
public double cost()
{
return 120 + pizza.cost();
}
}
public class ExtraCheese : ToppingDecorator // ToppingDecorator inherit Pizza
{
Pizza pizza;
public ExtraCheese(Pizza pizza)
{
this.pizza = pizza;
}
public String getDescription()
{
return pizza.getDescription() + “, ExtraCheese”;
}
public double cost()
{
return 160 + pizza.cost();
}
}
// similarly implement all toppings
Serve Some Pizzas
As we have implemented decorator pattern for Pizza Corner lets serve some order of pizza and see how its going to work.
public class PizzaCorner
{
public static void Main(String[] args)
{
Pizza pizza = new HotChickenWings();
System.Console.WriteLine(pizza.getDescription() + “ Rs.” +pizza.cost());
Pizza pizza2 = new BBQChicken();
pizza2 = new Onions(pizza2);
pizza2 = new ExtraCheese(pizza2);
pizza2= new Mushrooms(pizza2);
// cost triggering order is Mushrooms, ExtraCheese, Onions, BBQChicken
System.Console.WriteLine(pizza2.getDescription()+ “ Rs” +pizza2.cost());
}
}
Decorator Pattern in JavaScript
Let's implement the decorator pattern in JavaScript. Let's say a Cell Phone company implementing their system. They create Cell Phone with different features e.g, Camera, Wifi, 3G, Bluetooth etc each of these features has some cost. They want to implement their system in a way they don't need to change the whole system when they introduce a new phone model with some feature. Here we going to use decorator pattern in which we take base Cell Phone object and decorate it with Feature decorator.
//object we're going to decorate
function CellPhone() {
this.cost = function () { return 397; };
this.screenSize = function () { return 5; };
}
/*Decorator 1*/
function Camera(cellPhone) {
var price = cellPhone.cost();
cellPhone.cost = function() {
return price + 45;
}
}
/*Decorator 2*/
function Wifi(cellPhone){
//get cell phone current price
var price = cellPhone.cost();
//update cell phone cost() function
//and add feature price to current price
cellPhone.cost = function(){
return price + 90;
};
}
/*Decorator 3*/
function threeG(cellPhone){
var price = cellPhone.cost();
cellPhone.cost = function(){
return price + 90;
};
}
/*Decorator 4*/
function Bluetooth(cellPhone){
var price = cellPhone.cost();
cellPhone.cost = function(){
return price + 50;
};
}
Company introduced a new model with Camera, Wifi and bluetooth. Lets see how to decorate the object:
var newModelCellPhone = new CellPhone();
Camera(newModelCellPhone);
Wifi(newModelCellPhone);
Bluetooth(newModelCellPhone);
console.log(newModelCellPhone.cost());
console.log(newModelCellPhone.screenSize());
Conclusion
We have implemented Decorator Design Pattern which add behavior to an existing object without making any code changes to the underlying classes as you notice its follow the design principle of "Open for an extension, closed for the modification" Now if Pizza Corner add any new Topping serving the need to extend the system by implementing new decorator class and no need to existing system. If you have any question or feedback please post in comments.
Currying is technique mostly mentioned in functional programming as function currying.
What is Functional Programming?
Functional programming is a programming paradigm which primarily uses functions as means for building abstractions and expressing computations that comprise a computer program.
Confused! ok you do not need to understand what functional programming is for understanding currying. so ignore it.
What is currying?
Currying is to transform a function with many parameters to a function with less parameters or in other words, process of transforming a function with N parameters to a function that takes less than N parameters.
For example, a function takes A, B, C arguments and returns R as result i.e { A , B , C => R } currying allow you to change it to a function which takes only A as argument and returns you a function which take B as argument and this second function takes B as argument and returns a function which takes C as arguments and this last method takes the argument C and returns you the Result R.
{A => { B => { C => R } } }
The curried effect is achieved by providing some of the arguments of the main function at first invocation, so that those values are fixed for the next invocation.
var teacher = function(teacherName){
return function(subject){
console.log(teacherName+' teaches '+subject);
}
}
var aliceTeach= teacher('Alice');
aliceTeach('JavaScript');
aliceTeach('Data Structures');
Here we used the concept of JavaScript Closure (Closure allows you to use Parent scope variable in inner functions. ), first function takes the parameter teacherName and use this as closure in inner-function and return the function which has fixed value for teacher name but expecting subjects name. Since teacherName is prefilled, now calling function with subject has fixed teacher name with it.
Currying is helpful where your some arguments are fixed for certain module or series of function. For example you write a function that add two numbers (see demo):
function add(x,y){
console.log('Sum is : '+(x+y));
}
add(4,2);
but what if there is situation you need to add 4 to different numbers, means your first argument is fixed. If you implemented without currying like above you need to write:
add(4,10);
add(4,21);
add(4,83);
...
There is a chance of mistake in passing some other argument instead of 4 if not still it is redundant to pass same argument many times.
In JavaScript each object has a property of Prototype, allow to add a property or function to an object.
In JavaScript there is no concept of class, you need to create an object, then you can extend it actually that object is in JavaScript is a class. Prototype allows to add new functionality to existing object like adding subString(),reverse() to a string object.
If we take this like we have a Employee class, there are different types of Employees like Managers, Supervisors, Agents etc. But each type is actually inheriting Employee.
//Define a functional object to hold employee in JavaScript
var Employee = function(name) {
this.name = name;
};
//Add dynamically to the already defined object a new getter
Employee.prototype.getName = function() {
return this.name;
};
//Create a new object of type Employee
var judy= new Employee("Judy");
//Try the getter
alert(judy.getName());
//If now I modify employee, also Judy gets the updates
Employee.prototype.alertMyName = function() {
alert('Hello, my name is ' + this.getName());
};
//Call the new method on john
judy.alertMyName();
Here in above code we extended the base object, now we will create a child object and inherit it from base class (JsFiddle Demo).
//Create a new object of type Manager by defining its constructor.
// It's not related to Employee for now.
var Manager = function(name) {
this.name = name;
};
//Now I link the objects and to do so, we link the prototype of Manager
//to a new instance of Employee. The prototype is the base that will be
//used to construct all new instances and also, will modify dynamically
//all already constructed objects because in JavaScript objects retain
//a pointer to the prototype
Manager.prototype = new Employee();
//Now I can call the methods of Employee on the Manager, let's try,
//first I need to create a Manager.
var myManager = new Manager('John Smith');
myManager.alertMyName();
//If I add new methods to Employee, they will be added to Manager,
//but if I add new methods to Manager they won't be added
//to Employee. Example:
Employee.prototype.setSalary = function(salary) {
this.Salary = salary;
};
Employee.prototype.getSalary = function() {
return this.Salary;
};
//Let's try:
myManager.setSalary(30000);
alert(myManager.getSalary());
judy.setSalary(60000);
alert(judy.getSalary());
//Now if I added a property to Manager
Manager.prototype.Projects =function(){
return "Handling multiple projects";
}
//Projects function will be available for managers instances
alert(myManager.Projects());
//it wont be available for employee judy
if((typeof judy.Projects) !== "function")
alert('function not available');
While as said I cannot call Projects() on a Employee. Because parent class does not have implementation of child class function.
//The following statement generates an error.
judy.Projects();
How Prototype chain works?
When it calls the parent class function, it firstly find member in the current object of Manager, but as alertMyName() was not available there so it searches in prototype, and it keep finding until it find the function or find the prototype null.
Prototype chain can be extended as many level as required, each time by setting the prototype of the child class equal to an object of the parent class. If you do not use prototype then it becomes a static and only available for current object. As we know object in JavaScript is a class and making a static function only available for that particular object and for other object of same type cannot access the same function while creating function with prototype is available in all objects.
//current object will call it function as it associated to it
//it can be called with this object only
myClass.myFunction();
//now create instance variable
var objectOne = new myClass();
var objectTwo = new myClass();
//now calling myFunction with multiple instances will throw error
objectOne.myFunction();
objectTwo.myFunction();
var myClass =function(){};
myClass.prototype.myFunction = function() {
alert('Hello class Function');
}
//now create instance variable
var objectOne = new myClass();
var objectTwo = new myClass();
//now calling myFunction with multiple instances will not throw error
objectOne.myFunction();
objectTwo.myFunction();
If you want to add something on this post please comments.
