wft-utils/just-play/design-pattern/index.js

The commonly used tool functions in daily development

/**
 * 工厂模式
 * 通过函数的方式创建对象，不暴露new关键字，简化代码
 */ 
class A {
  constructor({ name, age }) {
    this.name = name
    this.age = age
  }
  info() {
    console.log(`--${this.name}--${this.age}`)
  }
}
function createA(o) {
  return new A(o)
}
const a = createA({ name: 'wft', age: 18 })


/**
 * 单例模式
 */
class B {
  static getInstance() {
    if(this.instance) {
      return this.instance
    }
    this.instance = new B()
    return this.instance
  }
}
let b1 = B.getInstance()
let b2 = B.getInstance()
// console.log(b1 === b2) // true


/**
 * 观察者模式
 */
class Observerd {
  #observerList = null
  constructor() {
    this.#observerList = []
  }
  addObserver(observer) {
    this.#observerList.push(observer)
  }
  notify() {
    this.#observerList.forEach(observer => {
      observer.update()
    })
  }
}
class Observer {
  #doSome = null
  constructor(doSome) {
    this.#doSome = doSome
  }
  update() {
    console.log(this.#doSome)
  }
}
// const obj1 = new Observer('观察者1')
// const obj2 = new Observer('观察者2')
// const objd = new Observerd()
// objd.addObserver(obj1)
// objd.addObserver(obj2)
// objd.notify()


/**
 * 代理模式
 */
export function createProxyObj(obj) {
  return new Proxy(obj, {
    get(target, key, receiver) {
      return Reflect.get(target, key, receiver)
    },
    set(target, key, value, receiver) {
      return Reflect.set(target, key, value, receiver)
    },
    deleteProperty(target, key) {
      return Reflect.deleteProperty(target, key)
    }
  })
}

/**
 * 发布订阅模式
 */
export class EventBus {
  #arrays = null
  constructor() {
    this.#arrays = {}
  }
  // 订阅
  on(type, fn) {
    this.#arrays[type] = this.#arrays[type] || []
    this.#arrays[type].push(fn)
  }
  // 发布
  emit(type, ...data) {
    if (!this.#arrays[type]) return
    this.#arrays[type].forEach(callback => {
      callback(...data)
    })
  }
  // 解绑
  off(type, fn) {
    const args = Array.from(arguments)
    if (args.length === 0) {
      this.#arrays = {}
    } else if (args.length === 1) {
      if (!this.#arrays[type]) return
      this.#arrays[type] = []
    } else if (args.length === 2) {
      if (!this.#arrays[type]) return
      for (let i = this.#arrays[type].length - 1; i >= 0; i--) {
        if (this.#arrays[type] === fn) {
          this.#arrays[type].splice(i, 1)
        }
      }
    }
  }
}

// /**
//  * 装饰器模式
//  */

// function test(...args) {
//   return function(target , name , descriptor) {
//     // 操作...
//   }
// }

// @test('test', '1', '2')
// class W {

// }