• 分类
  • 关于
    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