Learning JavaScript Design Patterns

دوره آموزش Javascript

1. Introduction . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1
2. What is a Pattern? . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 3
We already use patterns everyday 4
3. 'Pattern'-ity Testing, Proto-Patterns & The Rule Of Three . . . . . . . . . . . . . . . . . . . . . . 7
4. The Structure Of A Design Pattern . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 9
5. Writing Design Patterns . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 11
6. Anti-Patterns . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 13
7. Categories Of Design Pattern . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
Creational Design Patterns 15
Structural Design Patterns 16
Behavioral Design Patterns 16
8. Design Pattern Categorization . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 17
A brief note on classes 17
9. JavaScript Design Patterns . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 21
The Creational Pattern 22
The Constructor Pattern 23
Basic Constructors 23
Constructors With Prototypes 24
The Singleton Pattern 24
The Module Pattern 27

Modules 27
Object Literals 27
The Module Pattern 29
The Revealing Module Pattern 36
The Observer Pattern 37
Advantages 38
Disadvantages 39
Implementations 39
The Mediator Pattern 49
Advantages & Disadvantages 50
Mediator Vs. Observer 51
Mediator Vs. Facade 51
The Prototype Pattern 52
The Command Pattern 54
The Facade Pattern 56
The Factory Pattern 58
When To Use The Factory Pattern 59
When Not To Use The Factory Pattern 59
The Mixin Pattern 60
The Decorator Pattern 61
Subclassing 61
Decorators 63
Example 1: Basic decoration of existing object constructors with new
functionality 63
Example 2: Simply decorate objects with multiple decorators 64
Pseudo-classical decorators 65
Interfaces 65
This variation of decorators and abstract decorators 66
Implementing decorators with jQuery 69
Pros and cons of the pattern 70
10. Flyweight . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 71
Flyweight and the data layer 72
Converting code to use the Flyweight pattern 72
A Basic Factory 74
Managing the extrinsic states 74
The Flyweight pattern and the DOM 76
Example 1: Centralized event handling 76
Example 2: Using the Flyweight for Performance Gains 77
11. MV* Patterns . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 79
MVC 79
Smalltalk-80 MVC 79