javascript设计模式
前言:
javascript设计模式之单例模式,保证一个类仅有一个实例,并提供一个访问它的全局访问点
单例模式
var createSingle = (function() {
var _flag = null
return function () {
if(_flag === null){
_flag = true
}
return _flag
}
})()
var a1 = createSingle ()
var a2 = createSingle ()
console.log(a1 === a2)
工厂模式
function A(name) {
this.name = name
}
A.prototype.getName = function () {
console.log(this.name)
}
function B(model) {
this.model = model
}
B.prototype.getModel = function () {
console.log(this.model)
}
function create(type, param) {
// instanceof 会判断后面的构造函数的原型是否存在当前这个对象的原型链里
if (this instanceof create) {
return new this[type](param)
} else {
return new create(type, param)
}
}
create.prototype = {
A,
B
}
var c = new create('A', '123')
console.log(c); // A {name: '123'}
var d = create("B", 666)
console.log(d); // B { model: 666 }
策略模式
let strategy = {
S:(salary) => {
return salary*5
},
A:(salary) => {
return salary*4
},
B:(salary) => {
return salary*3
},
C:(salary) => {
return salary*2
},
}
function settlement(grade,salary){
return strategy[grade](salary)
}
settlement('S',10000) // 50000
settlement('A',5000) // 20000
发布订阅
class EventEmitter {
constructor() {
this.events = {};
}
// 订阅事件
on(event, listener) {
if (!this.events[event]) {
this.events[event] = [];
}
this.events[event].push(listener);
}
// 发布事件
emit(event, ...args) {
if (this.events[event]) {
this.events[event].forEach(listener => {
listener(...args);
});
}
}
// 移除事件监听器
off(event, listener) {
if (this.events[event]) {
this.events[event] = this.events[event].filter(l => l !== listener);
}
}
// 只订阅一次事件
once(event, listener) {
const onceListener = (...args) => {
listener(...args);
this.off(event, onceListener);
};
this.on(event, onceListener);
}
}
// 使用示例
const emitter = new EventEmitter();
// 订阅事件
emitter.on('greet', (name) => {
console.log(`Hello, ${name}!`);
});
// 发布事件
emitter.emit('greet', 'Alice'); // 输出: Hello, Alice!
// 移除事件监听器
const listener = (name) => {
console.log(`Goodbye, ${name}!`);
};
emitter.on('greet', listener);
emitter.off('greet', listener);
// 只订阅一次事件
emitter.once('greet', (name) => {
console.log(`Hi, ${name}!`);
});
emitter.emit('greet', 'Bob'); // 输出: Hi, Bob!
emitter.emit('greet', 'Charlie'); // 不会输出任何内容
分类:
js
创建时间:
2022-06-08 08:00:00
更新时间:
2024-11-14 10:36:10