读《JavaScript设计模式与开发实践》学习 发布-订阅 模式

[lizhongzhen11]

2019-12-06 更新

说来惭愧，时隔半年，我居然给忘了，居然一时想不起来怎么写了。。。
不过这次愣是没有看任何文章，自己在本地慢慢猜想+代码实践勉强写出来了，代码和经历在：utils/on.js 里

啰嗦几句

  由于自己体质不强加上之前一直加班，结果查出了一种病，为了自己的未来，想想还是从南京撤了。不值得，一年也就挣那么点钱。。。5.2号回来的，在家玩了一个月的梦幻西游了，真好玩！
  接下来可能会去扬州市区找工作，目前只会开发，能找个不加班的就好，找不到的话也许在镇上厂里找个文职类工作了。自己有注册个小工作室，只是没有接单来源，考虑自身实力不够硬，尤其是后端数据库那块，如果自己一个人独立开发完整项目是不行的，目前了解到扬州基本上在招前后端都能写的，有点小凉。。。
  不管接下来干什么，技术这块还是不能随意丢弃的，买了很多书都没看呢，所以现在要求自己早上看书，下午才能玩游戏，哈哈。
  《JavaScript设计模式与开发实践》这本书还是很棒的，发布-订阅模式其实开发中经常遇到，不过大多都是人家封装好的，难得静下心来去研究研究，之前面试蚂蚁金服时就要求我手写，可惜菜啊，不会啊，今天早上把书上内容看完，然后自己凭着理解去写、实践，还是有点小收获的，满满的自豪感~~~

附上代码

var Subscribe = (function () {
  let subscriber = {}, // 缓存订阅者和它订阅的信息类型;
      listen, // 添加订阅者
      publish, // 发布数据
      remove // 移除订阅

  /**
   * @param {key} 订阅的信息类型
   * @param {fn} 订阅者的回调函数
   * @description 添加订阅者(订阅事件)
   */
  listen = function (key, fn) {
    if (!subscriber[key]) {
      subscriber[key] = []
    }
    subscriber[key].push(fn)
  }

  /**
   * @description 发布执行 
   */
  publish = function () {
    let key = Array.prototype.shift.call(arguments), // 得到订阅的信息类型
        fns = subscriber[key] // 对应的订阅回调函数
    // 没有对应的订阅事件
    if (!fns) {
      return false
    }
    // 对该订阅类型下的回调函数全部派发执行
    for (let i = 0, fn; fn = fns[i++];) {
      fn.apply(this, arguments)
    }
  }

  /**
   * @param {key} 订阅类型/标识
   * @param {fn} 需要移除的订阅回调函数
   * @description 删除订阅
   */
  remove = function (key, fn) {
    let fns = subscriber[key] // 对应的订阅回调函数集合
    if (!fns) {
      return false
    }
    // 没有指定要移除的订阅回调函数，则将对应类型下的回调函数全部移除
    if (!fn) {
      fns.length = 0
    } else {
    // 指定了需要移除的订阅回调函数
      for (let i = 0; i < fns.length; i++) {
        if (fns[i] === fn) {
          fns.splice(i, 1)
        }
      }  
    }
  }

  return {
    subscriber: subscriber,
    listen: listen,
    publish: publish,
    remove: remove
  }
})()

Subscribe.listen('a', function (data) {
  console.log('a: ' + data)
})

Subscribe.publish('a', 20000)

[zxy7]

咋回事儿

[lizhongzhen11]

咋回事儿

昝百亿@zxy7

[zxy7]

咋回事儿

昝百亿@zxy7

wx说