【Javascript】发布订阅模式

最新推荐文章于 2024-06-04 17:21:52 发布

王昱潇

最新推荐文章于 2024-06-04 17:21:52 发布

阅读量121

点赞数

分类专栏：前端学习笔记文章标签： javascript

本文链接：https://blog.csdn.net/qs52955339/article/details/115673537

版权

前端同时被 2 个专栏收录

40 篇文章 1 订阅

订阅专栏

学习笔记

36 篇文章 0 订阅

订阅专栏

定义：

发布订阅模式其实是一种对象间一对多的依赖关系，当一个对象的状态发送改变时，所有依赖于它的对象都将得到状态改变的通知。

发布订阅模式与观察者模式的区别在于，观察者模式是松耦合，而发布者与订阅者是解耦的，它们彼此互不认识，发布者需要告诉调度中心要发的消息是什么，订阅者需要向调度中心订阅事件，当发布者发布此类事件时，也就是该事件触发，再由调度中心通知订阅者。

示例：

当用户们在购物网站购物发现没有现货时，用户们收藏了该店铺，等商家补货时会通知他们。

实现思路：

1、想好谁是发布者

2、给发布者添加一个缓存列表，用于存放回调函数来通知订阅者

3、发布消息，发布者遍历缓存列表，一次触发里面存放的订阅者回调函数

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>发布订阅模式</title>
</head>
<body>

<script>
    var Event = (function(){
        var list = {},
            listen,
            trigger,
            remove;

        listen = function (key, fn) {
                    if(!this.list[key]) {
                        this.list[key] = []
                    }
                    this.list[key].push(fn)
                }
        trigger =  function () {
            //取出对应的key
            var key = Array.prototype.shift.call(arguments)  //因为arguments是个类数组对象，所以不能直接使用shift()方法
            var fns = this.list[key]
            if (!fns || fns.length == 0) {
                return
            }
            for (var i = 0, fn; fn = fns[i++];) {
                //fn.apply(this, arguments)  ES5写法
                fn(...arguments)
            }
        }

        remove = function (key, fn) {
            var fns = this.list[key]
            if (!fns) {
                return false
            }
            if (!fn) {
                fn && (fns.length = 0)
            } else {
                for (var i = fns.length - 1; i >= 0; i--) {
                    var _fn = fns[i]
                    if (_fn == fn) {
                        fns.splice(i, 1)
                    }
                }
            }
        }
        return {
            listen,
            trigger,
            remove
        }
    })()
</script>
</body>
</html>

以上仅做为个人学习使用。

王昱潇

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
【Javascript】发布订阅模式

定义：发布订阅模式其实是一种对象间一对多的依赖关系，当一个对象的状态发送改变时，所有依赖于它的对象都将得到状态改变的通知。发布订阅模式与观察者模式的区别在于，观察者模式是松耦合，而发布者与订阅者是解耦的，它们彼此互不认识，发布者需要告诉调度中心要发的消息是什么，订阅者需要向调度中心订阅事件，当发布者发布此类事件时，也就是该事件触发，再由调度中心通知订阅者。示例：当用户们在购物网站购物发现没有现货时，用户们收藏了该店铺，等商家补货时会通知他们。实现思路：1、想好谁是发布者2、给发布
复制链接

扫一扫

专栏目录