SlideShare a Scribd company logo
Santhosh Kumar
Github.com/santhotech
An Introduction to Design Patterns
What are Design Patterns
• Design Patterns provide the roadmap to implement solutions for various issues
in software development
• A ready made solution that can be customized and reused
• A design pattern will make the code look self expressive by providing structure
and semantics to the code
• They are not the final solution but a means to achieve the solution in an elegant
manner
• Provides a common platform and reduces time required for transition
Advantages
• Provides the ability to reuse code that can save a lot of time
• It is a standard that developers are aware of hence improves
the understanding of code base new/old within a team
• If used efficiently can help in reducing the overall footprint
• Provides multiple platforms that doesn’t constraint the usage
or dictate the behaviour while maintaining the sanity of the
system
• Helps in faster testing and implementation
Design Pattern Categories
• Creational Design Patterns
– Deals with the way a class and object instances are created
• Structural Design Patterns
– Deals with maintaining structural integrity of the system by enforcing sane
relationships
• Behavioural Design Patterns
– Helps in establishing communication between distinct parts of the system (or)
Object communication
Creational Patterns
• Deals with Object creation mechanism and class creation
mechanism
• Provides a way for object creation depending on the changing
scenarios
• Reduces duplication in terms of instantiation
• Reduces memory over head in dealing with multiple objects of
the same type
• Ex: Constructor, Factory, Abstract, Prototype, Singleton, Builder
etc
Structural Design Pattern
• Provides a set of protocols on structuring the components of
the system
• Helps in reducing/decoupling the structural dependencies with
in a system
• Provides a means to create independent structures that can
maintain their own state
• Helps in restructuring the components of the system which
doesn’t have a common purpose
• Ex: Decorator, Façade, Adapter, Proxy etc
Behavioural Design Pattern
• Focuses on streamlining the communication between the
objects in the system
• Helps in establishing a common set of protocols to pass data
and keep objects in sync
• Provides a means to ensure reactive implementation of objects
irrespective of their state
• Ensures that communication happens through as less channels
as possible to ensure maintainability
• Ex: Iterator, Mediator, Chain of Command, Observer, Visitor etc
Design Patterns in OO Javascript
• JavaScript is a Pseudo class based language – Functions are
manipulated to simulate a class based environment
• All JS objects are inherited from “Object” using a base
constructor
• All constructors gets a prototype object
• All default properties of an object is assigned in the prototype
• Each individual object consists of its own prototype which
inherits from the parent
Constructor pattern
• Creational Design Pattern
• Javascript objects can be created by
• var obj = {};
• var obj = Object.create(Object.prototype);
• Var obj = new Object();
• Any call to a function is actually a call to a constructor method of the
same function since functions behaves like classes in javascripts
• Adding a “new” to a constructor makes it return a empty instance (if
passed without parameters) of the object the constructor points to
Cont…
function Animal(name, class) {
this.name = name;
this.class = class;
this.getName = function() {
return “Name :”+this.name;
}
Var a1 = new Animal(“lion”, “predator”);
Var a2 = new Animal(“Tiger”, “predator”);
Cont…
• All common methods can be grouped in a single wrapper
• “this” refers to the current object inside the constructor
function
• Not ideal as inheritance cannot be implemented directly –
scope of “this” referring to the methods will result in a conflict
• Methods referenced with this gets redefined for every instance
that is created – end up with 100 “getName” definitions if there
are 100 animals
• JS consists of a prototype property that is available for all
functions
• Any number of methods and properties can be attached to the
prototype property of the function
• When constructor is called to create new object the properties
attached to prototype of the constructor is automatically
available to the new object
• The “this” keyword inside a property attached to prototype will
still refer to the current object
function Animal(name, class) {
this.name = name;
this.class = class;
}
Animal.prototype.getName = function() {
return “Name :”+this.name;
}
Var a1 = new Animal(“lion”, “predator”);
Var a2 = new Animal(“Tiger”, “predator”);
Usage/Merits/Demerits
• Ideal for wrapping up related and group able properties within
an object container
• Can be used where ever a fundamental level of abstraction is
required
• Provides a very easy implementation of inheritance and
prototypal inheritance
• Doesn’t provide a direct mechanism to contain private
members
Object Literal Pattern
• Another Creational Design Pattern
• Not the usual means to “instantiate” an object
• Provides a way to group related behaviour usually in terms of a
page/UI component
Var gridComponent = {
settings: {
gridColor: “#ff0000”,
gridTitle: “My Title”
},
init: function{
if (settings && settings(settings) == 'object') {
$.extend(gridComponent.settings, settings);
}
gridComponent.bindEvents();
}
bindEvents: function() {
$(“#btn”).on(“click”, function() { gridComponent.onButtonClick(); });
$(“#drp”).on(“change”, function() { gridComponent.onDrpChange(); });
}
}
Usage/Merits/Demerits
• Can be used especially when dealing with third party libraries
like Jquery to group common behaviour
• Instead of spaghetti calling methods of same component just a
online initiation replaces all other calls
• Code may be longer than other forms of implementation
• But the grouping helps in maintainability
• Doesn’t provide private members
Modular Pattern
• Provides the ability to effect namespacing
• Allows creation of private members
• Expose only certain logic that needs to be used by other parts
of the system
• Helps to keep the global namespace clean and free of pollution
from the method variables
Var Chart = (function(){
var chartWidth = 100;
var chartHeight = 100;
getAxis = function(param) {
return Math.round(rand(param,2));
}
return {
generateChart: function(chartParam) {
return getAxis(chartParam);
}
}
})();
Usage/Merits/Demerits
• Can be used where private members are required to keep the
namespace clean and avoid naming conflicts which is also the
advantage of using this pattern
• The private methods cannot be extended since their visibility is
shielded
• Objects added later to the chain does not have access to the
private members
• Private members cannot be unit tested
Revealing Module Pattern
• A Slight variation of the modular pattern
• In module pattern public methods need to address one another
along with the name of module
• Revealing module pattern addresses this by returning an object
with references to the methods that are public and keeping all
methods private by default
var Chart = (function(){
var chartX = 0;
var chartY = 0;
function manipulate() {
}
function manipulateXY() {
return manipulate();
}
function generateChart(param) {
return manipulateXY();
}
return {
getChart: generateChart
};
})();
Chart.getChart(param);
Usage/Merits/Demerits
• Syntax is much cleaner as the return object clearly specifies
what are returned hence establishing what are public
• Pattern is flexible enough only for public methods and not for
public members
• Does not play well with inheritance as the public methods
returned cannot be overridden since only reference is returned
Singleton Pattern
• Restricts the instantiation of a class to just once such that it
returns the same instance whenever and wherever it is
requested from
• Singletons in JS returns a structure rather than returning an
object or more precisely a reference to an object
Var Helper = (function(){
var helperInstance;
function init() {
function domHelperPvt() {
}
var domHelperPvtProp = 0;
return {
domHelperPub: function () {
},
domHelperPubProp: 1
};
};
return {
getHelperInstance: function () {
if ( !helperInstance) {
helperInstance = init();
}
return helperInstance;
}
};
})();
Var helper = Helper.getHelperInstance();
Helper.domHelperPub();
Usage/Merits/Demerits
• Used to create static instance like behaviour for accessing
methods that are common across a wide range of components
in a system
• Reduces memory overhead and helps in sane garbage
collection
• Too many singletons will result in application being tightly
coupled, hence reduce the performance and also
maintainability
Factory Pattern
• Provides a platform to provide objects that may be required
frequently from time to time and also used by multiple
components
• Not restricted to one instance but may not necessarily create
new instance if the existing one can be reused
• Also a creational pattern
Function DomFactory {
this.createNewDom = function(domtype,param) {
var newDom;
if(domType===“chart”) {
newDom = new Chart(param);
}
if(domType===“grid”) {
newDom = new Grid(param);
}
return newDom;
}
}
DomFactory.createNewDom(“chart”,param);
Usage/Merits/Demerits
• Useful when the calling client may need different objects
depending on the scenario and such clients exist across the
system
• Reduces the logical overhead in the client requesting for the
object and moves common logic to a common wrapper that can
be reused as necessary
• Cannot be used when there is no common behaviour between
the objects returned
Proto Patterns
• Patterns can be created within a team depending on what the
team feels is efficient while maintaining the common rules that
a pattern should adhere to
• A Pattern created within a team which can evolve over a period
of time to represent something that is achieved through it
• Proto Patterns will evolve to be design patterns when it is
widely accepted by the community
• Ex: Revealing Module Pattern
Thank You

More Related Content

What's hot (20)

PDF
Creational Design Patterns
Jamie (Taka) Wang
 
PDF
JavaScript Modules Done Right
Mariusz Nowak
 
PDF
Core concepts-javascript
Prajwala Manchikatla
 
PDF
Future-proofing Your JavaScript Apps (Compact edition)
Addy Osmani
 
PPTX
Javascript Prototype Visualized
军 沈
 
PPTX
Advanced Object Oriented JavaScript (prototype, closure, scope, design patterns)
raja kvk
 
PDF
Prototype
Aditya Gaur
 
PDF
Design Patterns Illustrated
Herman Peeren
 
PDF
Design patterns in PHP
Jason Straughan
 
PDF
Secrets of JavaScript Libraries
jeresig
 
PPTX
Javascript best practices
Manav Gupta
 
PPTX
Object Oriented JavaScript
Julie Iskander
 
PDF
Ten useful JavaScript tips & best practices
Ankit Rastogi
 
PDF
Scalable JavaScript Application Architecture
Nicholas Zakas
 
PPT
C++ Memory Management
Anil Bapat
 
PDF
Design patterns in javascript
Ayush Sharma
 
PDF
Patterns for JVM languages - Geecon 2014
Jaroslaw Palka
 
PPTX
Design pattern (Abstract Factory & Singleton)
paramisoft
 
PDF
Performance Optimization and JavaScript Best Practices
Doris Chen
 
PDF
Django design-patterns
Agiliq Info Solutions India Pvt Ltd
 
Creational Design Patterns
Jamie (Taka) Wang
 
JavaScript Modules Done Right
Mariusz Nowak
 
Core concepts-javascript
Prajwala Manchikatla
 
Future-proofing Your JavaScript Apps (Compact edition)
Addy Osmani
 
Javascript Prototype Visualized
军 沈
 
Advanced Object Oriented JavaScript (prototype, closure, scope, design patterns)
raja kvk
 
Prototype
Aditya Gaur
 
Design Patterns Illustrated
Herman Peeren
 
Design patterns in PHP
Jason Straughan
 
Secrets of JavaScript Libraries
jeresig
 
Javascript best practices
Manav Gupta
 
Object Oriented JavaScript
Julie Iskander
 
Ten useful JavaScript tips & best practices
Ankit Rastogi
 
Scalable JavaScript Application Architecture
Nicholas Zakas
 
C++ Memory Management
Anil Bapat
 
Design patterns in javascript
Ayush Sharma
 
Patterns for JVM languages - Geecon 2014
Jaroslaw Palka
 
Design pattern (Abstract Factory & Singleton)
paramisoft
 
Performance Optimization and JavaScript Best Practices
Doris Chen
 
Django design-patterns
Agiliq Info Solutions India Pvt Ltd
 

Similar to Introduction to Design Patterns in Javascript (20)

PPT
Design pattern
Shreyance Jain
 
PPT
Javascript design patterns
GomathiNayagam S
 
PPTX
Software Patterns
bonej010
 
PDF
Javascript Design Patterns
Lilia Sfaxi
 
PPT
Software Design Patterns
Satheesh Sukumaran
 
PPT
Software Design Patterns
Satheesh Sukumaran
 
PPTX
Typescript design patterns applied to sharepoint framework - Sharepoint Satur...
Luis Valencia
 
PDF
Benefits of using software design patterns and when to use design pattern
Beroza Paul
 
PDF
Scalable JavaScript Design Patterns
Addy Osmani
 
PPTX
Design pattern in an expressive language java script
Amit Thakkar
 
PPTX
OOPSDesign PPT ( introduction to opps and design (
bhfcvh531
 
PPT
Java Script Patterns
Allan Huang
 
PDF
JavaScript Design Patterns Hugo Di Francesco
oipyapohi698
 
PPTX
JavaScripters Event Sep 17, 2016 · 2:00 PM: Scalable Javascript Design Patterns
JavaScripters Community
 
PPTX
JavaScript design patterns introduction
D Balaji
 
PDF
Style & Design Principles 02 - Design Patterns
Nick Pruehs
 
PPTX
Design patterns software re engineering lect 10
HibaAmjadSiddiqui
 
PDF
Essential java script design patterns
gaiashare
 
PPTX
Nodejs Chapter 3 - Design Pattern
Talentica Software
 
PPTX
Cs 1023 lec 8 design pattern (week 2)
stanbridge
 
Design pattern
Shreyance Jain
 
Javascript design patterns
GomathiNayagam S
 
Software Patterns
bonej010
 
Javascript Design Patterns
Lilia Sfaxi
 
Software Design Patterns
Satheesh Sukumaran
 
Software Design Patterns
Satheesh Sukumaran
 
Typescript design patterns applied to sharepoint framework - Sharepoint Satur...
Luis Valencia
 
Benefits of using software design patterns and when to use design pattern
Beroza Paul
 
Scalable JavaScript Design Patterns
Addy Osmani
 
Design pattern in an expressive language java script
Amit Thakkar
 
OOPSDesign PPT ( introduction to opps and design (
bhfcvh531
 
Java Script Patterns
Allan Huang
 
JavaScript Design Patterns Hugo Di Francesco
oipyapohi698
 
JavaScripters Event Sep 17, 2016 · 2:00 PM: Scalable Javascript Design Patterns
JavaScripters Community
 
JavaScript design patterns introduction
D Balaji
 
Style & Design Principles 02 - Design Patterns
Nick Pruehs
 
Design patterns software re engineering lect 10
HibaAmjadSiddiqui
 
Essential java script design patterns
gaiashare
 
Nodejs Chapter 3 - Design Pattern
Talentica Software
 
Cs 1023 lec 8 design pattern (week 2)
stanbridge
 
Ad

Recently uploaded (20)

PDF
Powering GIS with FME and VertiGIS - Peak of Data & AI 2025
Safe Software
 
PDF
Beyond Binaries: Understanding Diversity and Allyship in a Global Workplace -...
Imma Valls Bernaus
 
PPTX
Agentic Automation Journey Series Day 2 – Prompt Engineering for UiPath Agents
klpathrudu
 
PDF
Mobile CMMS Solutions Empowering the Frontline Workforce
CryotosCMMSSoftware
 
PDF
Thread In Android-Mastering Concurrency for Responsive Apps.pdf
Nabin Dhakal
 
PPTX
How Cloud Computing is Reinventing Financial Services
Isla Pandora
 
PPTX
Agentic Automation Journey Session 1/5: Context Grounding and Autopilot for E...
klpathrudu
 
PDF
HiHelloHR – Simplify HR Operations for Modern Workplaces
HiHelloHR
 
PPTX
Hardware(Central Processing Unit ) CU and ALU
RizwanaKalsoom2
 
PDF
Unlock Efficiency with Insurance Policy Administration Systems
Insurance Tech Services
 
PDF
Efficient, Automated Claims Processing Software for Insurers
Insurance Tech Services
 
PDF
GetOnCRM Speeds Up Agentforce 3 Deployment for Enterprise AI Wins.pdf
GetOnCRM Solutions
 
PDF
MiniTool Partition Wizard 12.8 Crack License Key LATEST
hashhshs786
 
PDF
Digger Solo: Semantic search and maps for your local files
seanpedersen96
 
PDF
vMix Pro 28.0.0.42 Download vMix Registration key Bundle
kulindacore
 
DOCX
Import Data Form Excel to Tally Services
Tally xperts
 
PDF
Odoo CRM vs Zoho CRM: Honest Comparison 2025
Odiware Technologies Private Limited
 
PPTX
Why Businesses Are Switching to Open Source Alternatives to Crystal Reports.pptx
Varsha Nayak
 
PPTX
Empowering Asian Contributions: The Rise of Regional User Groups in Open Sour...
Shane Coughlan
 
PPTX
Agentic Automation: Build & Deploy Your First UiPath Agent
klpathrudu
 
Powering GIS with FME and VertiGIS - Peak of Data & AI 2025
Safe Software
 
Beyond Binaries: Understanding Diversity and Allyship in a Global Workplace -...
Imma Valls Bernaus
 
Agentic Automation Journey Series Day 2 – Prompt Engineering for UiPath Agents
klpathrudu
 
Mobile CMMS Solutions Empowering the Frontline Workforce
CryotosCMMSSoftware
 
Thread In Android-Mastering Concurrency for Responsive Apps.pdf
Nabin Dhakal
 
How Cloud Computing is Reinventing Financial Services
Isla Pandora
 
Agentic Automation Journey Session 1/5: Context Grounding and Autopilot for E...
klpathrudu
 
HiHelloHR – Simplify HR Operations for Modern Workplaces
HiHelloHR
 
Hardware(Central Processing Unit ) CU and ALU
RizwanaKalsoom2
 
Unlock Efficiency with Insurance Policy Administration Systems
Insurance Tech Services
 
Efficient, Automated Claims Processing Software for Insurers
Insurance Tech Services
 
GetOnCRM Speeds Up Agentforce 3 Deployment for Enterprise AI Wins.pdf
GetOnCRM Solutions
 
MiniTool Partition Wizard 12.8 Crack License Key LATEST
hashhshs786
 
Digger Solo: Semantic search and maps for your local files
seanpedersen96
 
vMix Pro 28.0.0.42 Download vMix Registration key Bundle
kulindacore
 
Import Data Form Excel to Tally Services
Tally xperts
 
Odoo CRM vs Zoho CRM: Honest Comparison 2025
Odiware Technologies Private Limited
 
Why Businesses Are Switching to Open Source Alternatives to Crystal Reports.pptx
Varsha Nayak
 
Empowering Asian Contributions: The Rise of Regional User Groups in Open Sour...
Shane Coughlan
 
Agentic Automation: Build & Deploy Your First UiPath Agent
klpathrudu
 
Ad

Introduction to Design Patterns in Javascript

  • 2. What are Design Patterns • Design Patterns provide the roadmap to implement solutions for various issues in software development • A ready made solution that can be customized and reused • A design pattern will make the code look self expressive by providing structure and semantics to the code • They are not the final solution but a means to achieve the solution in an elegant manner • Provides a common platform and reduces time required for transition
  • 3. Advantages • Provides the ability to reuse code that can save a lot of time • It is a standard that developers are aware of hence improves the understanding of code base new/old within a team • If used efficiently can help in reducing the overall footprint • Provides multiple platforms that doesn’t constraint the usage or dictate the behaviour while maintaining the sanity of the system • Helps in faster testing and implementation
  • 4. Design Pattern Categories • Creational Design Patterns – Deals with the way a class and object instances are created • Structural Design Patterns – Deals with maintaining structural integrity of the system by enforcing sane relationships • Behavioural Design Patterns – Helps in establishing communication between distinct parts of the system (or) Object communication
  • 5. Creational Patterns • Deals with Object creation mechanism and class creation mechanism • Provides a way for object creation depending on the changing scenarios • Reduces duplication in terms of instantiation • Reduces memory over head in dealing with multiple objects of the same type • Ex: Constructor, Factory, Abstract, Prototype, Singleton, Builder etc
  • 6. Structural Design Pattern • Provides a set of protocols on structuring the components of the system • Helps in reducing/decoupling the structural dependencies with in a system • Provides a means to create independent structures that can maintain their own state • Helps in restructuring the components of the system which doesn’t have a common purpose • Ex: Decorator, Façade, Adapter, Proxy etc
  • 7. Behavioural Design Pattern • Focuses on streamlining the communication between the objects in the system • Helps in establishing a common set of protocols to pass data and keep objects in sync • Provides a means to ensure reactive implementation of objects irrespective of their state • Ensures that communication happens through as less channels as possible to ensure maintainability • Ex: Iterator, Mediator, Chain of Command, Observer, Visitor etc
  • 8. Design Patterns in OO Javascript • JavaScript is a Pseudo class based language – Functions are manipulated to simulate a class based environment • All JS objects are inherited from “Object” using a base constructor • All constructors gets a prototype object • All default properties of an object is assigned in the prototype • Each individual object consists of its own prototype which inherits from the parent
  • 9. Constructor pattern • Creational Design Pattern • Javascript objects can be created by • var obj = {}; • var obj = Object.create(Object.prototype); • Var obj = new Object(); • Any call to a function is actually a call to a constructor method of the same function since functions behaves like classes in javascripts • Adding a “new” to a constructor makes it return a empty instance (if passed without parameters) of the object the constructor points to
  • 10. Cont… function Animal(name, class) { this.name = name; this.class = class; this.getName = function() { return “Name :”+this.name; } Var a1 = new Animal(“lion”, “predator”); Var a2 = new Animal(“Tiger”, “predator”);
  • 11. Cont… • All common methods can be grouped in a single wrapper • “this” refers to the current object inside the constructor function • Not ideal as inheritance cannot be implemented directly – scope of “this” referring to the methods will result in a conflict • Methods referenced with this gets redefined for every instance that is created – end up with 100 “getName” definitions if there are 100 animals
  • 12. • JS consists of a prototype property that is available for all functions • Any number of methods and properties can be attached to the prototype property of the function • When constructor is called to create new object the properties attached to prototype of the constructor is automatically available to the new object • The “this” keyword inside a property attached to prototype will still refer to the current object
  • 13. function Animal(name, class) { this.name = name; this.class = class; } Animal.prototype.getName = function() { return “Name :”+this.name; } Var a1 = new Animal(“lion”, “predator”); Var a2 = new Animal(“Tiger”, “predator”);
  • 14. Usage/Merits/Demerits • Ideal for wrapping up related and group able properties within an object container • Can be used where ever a fundamental level of abstraction is required • Provides a very easy implementation of inheritance and prototypal inheritance • Doesn’t provide a direct mechanism to contain private members
  • 15. Object Literal Pattern • Another Creational Design Pattern • Not the usual means to “instantiate” an object • Provides a way to group related behaviour usually in terms of a page/UI component
  • 16. Var gridComponent = { settings: { gridColor: “#ff0000”, gridTitle: “My Title” }, init: function{ if (settings && settings(settings) == 'object') { $.extend(gridComponent.settings, settings); } gridComponent.bindEvents(); } bindEvents: function() { $(“#btn”).on(“click”, function() { gridComponent.onButtonClick(); }); $(“#drp”).on(“change”, function() { gridComponent.onDrpChange(); }); } }
  • 17. Usage/Merits/Demerits • Can be used especially when dealing with third party libraries like Jquery to group common behaviour • Instead of spaghetti calling methods of same component just a online initiation replaces all other calls • Code may be longer than other forms of implementation • But the grouping helps in maintainability • Doesn’t provide private members
  • 18. Modular Pattern • Provides the ability to effect namespacing • Allows creation of private members • Expose only certain logic that needs to be used by other parts of the system • Helps to keep the global namespace clean and free of pollution from the method variables
  • 19. Var Chart = (function(){ var chartWidth = 100; var chartHeight = 100; getAxis = function(param) { return Math.round(rand(param,2)); } return { generateChart: function(chartParam) { return getAxis(chartParam); } } })();
  • 20. Usage/Merits/Demerits • Can be used where private members are required to keep the namespace clean and avoid naming conflicts which is also the advantage of using this pattern • The private methods cannot be extended since their visibility is shielded • Objects added later to the chain does not have access to the private members • Private members cannot be unit tested
  • 21. Revealing Module Pattern • A Slight variation of the modular pattern • In module pattern public methods need to address one another along with the name of module • Revealing module pattern addresses this by returning an object with references to the methods that are public and keeping all methods private by default
  • 22. var Chart = (function(){ var chartX = 0; var chartY = 0; function manipulate() { } function manipulateXY() { return manipulate(); } function generateChart(param) { return manipulateXY(); } return { getChart: generateChart }; })(); Chart.getChart(param);
  • 23. Usage/Merits/Demerits • Syntax is much cleaner as the return object clearly specifies what are returned hence establishing what are public • Pattern is flexible enough only for public methods and not for public members • Does not play well with inheritance as the public methods returned cannot be overridden since only reference is returned
  • 24. Singleton Pattern • Restricts the instantiation of a class to just once such that it returns the same instance whenever and wherever it is requested from • Singletons in JS returns a structure rather than returning an object or more precisely a reference to an object
  • 25. Var Helper = (function(){ var helperInstance; function init() { function domHelperPvt() { } var domHelperPvtProp = 0; return { domHelperPub: function () { }, domHelperPubProp: 1 }; }; return { getHelperInstance: function () { if ( !helperInstance) { helperInstance = init(); } return helperInstance; } }; })(); Var helper = Helper.getHelperInstance(); Helper.domHelperPub();
  • 26. Usage/Merits/Demerits • Used to create static instance like behaviour for accessing methods that are common across a wide range of components in a system • Reduces memory overhead and helps in sane garbage collection • Too many singletons will result in application being tightly coupled, hence reduce the performance and also maintainability
  • 27. Factory Pattern • Provides a platform to provide objects that may be required frequently from time to time and also used by multiple components • Not restricted to one instance but may not necessarily create new instance if the existing one can be reused • Also a creational pattern
  • 28. Function DomFactory { this.createNewDom = function(domtype,param) { var newDom; if(domType===“chart”) { newDom = new Chart(param); } if(domType===“grid”) { newDom = new Grid(param); } return newDom; } } DomFactory.createNewDom(“chart”,param);
  • 29. Usage/Merits/Demerits • Useful when the calling client may need different objects depending on the scenario and such clients exist across the system • Reduces the logical overhead in the client requesting for the object and moves common logic to a common wrapper that can be reused as necessary • Cannot be used when there is no common behaviour between the objects returned
  • 30. Proto Patterns • Patterns can be created within a team depending on what the team feels is efficient while maintaining the common rules that a pattern should adhere to • A Pattern created within a team which can evolve over a period of time to represent something that is achieved through it • Proto Patterns will evolve to be design patterns when it is widely accepted by the community • Ex: Revealing Module Pattern