1. Implement the singleton mode
let Singleton = function (name) {
this.name = name;
this.instance = null;
}
Singleton.prototype.getName = function () {
console.log(this.name)
}
Singleton.getInstance = function (name) {
if (!this.instance) {
this.instance = new Singleton(name)
}
return this.instance;
}
let a = Singeton.getInstance('hello world')
Second, the strategy mode
javascrip function is also an object, so you can define functions with objects such as
let strategies = {
"type1": (salary) => {
return salary 1
},
"type2": (salary) => {
return salary 2
},
"type3": (salary) => {
return salary * 3
}
}
let calcular = function (level, salary) {
return strategieslevel
}
Three, agency model
Is not to operate on the original object, refer to another object for operation
let fruit = function (name) {
this.name = name;
}
fruit.prototype.getName = function () {
return this.name;
}
let People who want to eat apples = {
gouBuy: (name) => {
console.log('Buy some apples for me' + name)
}
}
let purchasing = {
buyCosmetic: function (fruit) {
Want to eat apple people.gouBuy(fruit.getName())
}
}
purchasing.buyCosmetic(new fruit('apple'))
Fourth, the iterative mode
is to match the functional requirements that are met through the loop
ar getActiveUploadObj = function () {
try {
return new ActiveXObject("TXFTNActiveX.FTNUpload"); // IE upload control
} catch (e) {
return false;
}
};
var getFlashUploadObj = function () {
if (supportFlash()) {// supportFlash function is not provided
var str ='<object type="application/x-shockwave-flash"></object>';
return $(str). appendTo($('body'));
}
return false;
};
var getFormUpladObj = function () {
var str ='<input name="file" type="file" class="ui-file"/>'; // form upload
return $(str).appendTo($('body'));
};
Fourth, the publish-subscribe model The
publish-subscribe model is also called the observer model. It defines a one-to-many dependency relationship between objects. When the state of an object changes, all objects that depend on it will be notified. In JavaScript development, we generally use the event model to replace the traditional publish-subscribe model.
var event = {
clientList: [],
listen: function (key, fn) {
if (!this.clientList[key]) {
this.clientList[key] = [];
}
this.clientList[key].push(fn ); // add the subscribed message to the buffer list
},
trigger: function () {
var key = Array.prototype.shift.call(arguments), // (1);
fns = this.clientList[key];
if ( !fns || fns.length === 0) {// If the corresponding message is not bound
return false;
}
for (var i = 0, fn; fn = fns[i++];) {
fn.apply(this, arguments); // (2) // arguments are the parameters brought when the trigger is
}
}
};
Define another installEvent function, which can dynamically install publish-subscribe functions for all objects:
var installEvent = function (obj) {
for (var i in event) {
obj[i] = event[i];
}
};
5. Command mode
Command mode is one of the simplest and most elegant modes. The command in command mode refers to
an instruction to perform some specific things.
Command mode is the most common scenarios: sometimes need to send a request to certain objects, but does not know receiving the request
who is who, not knowing what was requested operation yes. At this time, in a loosely coupled manner desirable to design programs, such request is sent
sender and the request receiver to eliminate the coupling between each other. E.g
var bindClick = function (button, func) {
button.onclick = func;
};
var MenuBar = {
refresh: function () {
console.log('Refresh menu interface');
}
};
var SubMenu = {
add: function ( ) {
console.log('Add submenu');
},
del: function () {
console.log('Delete submenu');
}
};
bindClick(button1, MenuBar.refresh);
bindClick(button2, SubMenu. add);
bindClick(button3, SubMenu.del); The
command mode is an invisible mode in the JavaScript language.
6. Combination mode
Combination mode uses small sub-objects to construct larger objects, and these small sub-objects may themselves be composed of
smaller "grandchildren". Tree-like structure
Purpose: Represents part of the overall hierarchy of the object. Combined mode can easily construct the entire portion of the object represented by a tree
structure. Especially when we are not sure how many levels of this tree exist during development. In most of the tree structure
after completion of the final, only the top-most object requests through the tree, can unify the operation of the entire tree. In combination mode
where you add and delete nodes of the tree is very convenient, and conforms to the Open Closed Principle.
The client wants to treat all objects in the tree uniformly. The composite mode allows customers to ignore the difference between composite objects and leaf objects.
When facing this tree , customers don’t need to care about whether the object currently being processed is a composite object or a leaf object, so they
don’t need to write a bunch of if and else statements to distinguish Deal with them. The composite object and the leaf object will do their own right things,
which is the most important ability of the composite model.