- List item
什么是PubSubJS?
PubSubJS 是一个用 JavaScript 编写的基于主题的 发布/订阅库。
PubSubJS 有同步解耦,所以主题是异步发布的。这有助于使您的程序保持可预测性,因为在消费者处理主题时,主题的发起者不会被阻止。
主要特点:
- 无依赖
- 同步解耦
- ES3 兼容。PubSubJS 应该能够在任何可以执行 JavaScript 的地方运行。浏览器、服务器、电子书阅读器、旧手机、游戏机。
- AMD / CommonJS 模块支持
- 不修改订阅者(jQuery 自定义事件修改订阅者)
- 易于理解和使用(感谢同步解耦)
小,小于 1kb 压缩和压缩
安装步骤和安装方法
1.通过 npm ( npm install pubsub-js)安装
npm i pubsub-js
2.通过script引用
使用方法举例
- 1 通过npm 安装使用方法
import PubSub from 'pubsub-js'
console.log(PubSup); /*输出下,查看都有哪些方法*/
使用
通过PubSup.subscribe 订阅函数
import PubSub from 'pubsub-js'
var aReturn = PubSup.subscribe('a',/*订阅的函数名字*/,(name,parameter)=>{
/*name 该订阅的函数名=== a */
/*parameter 传递的参数*/
console.log(name,parameter); /*a 1*/
}/*事件处理函数*/);
/*aReturn 是你订阅成功后返回的参数 它是一个唯一的值*/
/*如果你想解绑该订阅的事件可以通过这个返回值(aReturn)进行解绑,也可以通过你订阅函数名('a')进行解绑*/
通过PubSup.publish 进行发布 (也就是触发,调用你订阅的事件处理)
import PubSub from 'pubsub-js'
PubSup.publish('a',/*你要发布的事件名*/,1,/*传递的参数*/);
通过PubSup.unsubscribe 解除你订阅的事件 (解绑)
import PubSub from 'pubsub-js'
pubsup.unsubscribe('a',/*你要解绑的事件名*/);
/*如果你不想通过事件名来进行解绑是 ,可以通过你订阅的给你返回的参数,进行
解绑,因为该返回值唯一的也是你该订阅的事件别名*/
- 2 script src引用
<script src="./i.js"></script>
<script>
/*使用方法和 npm中的方法一样有的 只是不需要 import PubSup from
'pubsup-js' 通过script src 引入 */
console.log(PubSub)
</script>
PubSup 还有很多方法
例如 :subscribeOnce ,clearSubscriptions,clearAllSubscriptions 等...
/*通过 subscribeOnce 订阅的,那么他就是一次性的发布完了,就会被解绑了,当
然,不用你自己解绑,它自己就会解绑 因为它是 (一次性的)*/
/*clearAllSubscriptions 清除所有的订阅*/
/*clearSubscriptions 清除多个的订阅*/
如图:
解释:
如果你有点不明白,可以这样想 当你知道苹果100pro只卖1块钱时,你很想买,但是你
不知道什么时候售出,那你就可以给这卖广告的打个电话通知一下我要买,是不是相当 于(subscribe)在他这订阅一下
把你的名字和电话号码给他,然后他在把你的订阅的 收据返回给你,当要发布的时候在通知你(publish)打电话给你通知一下,如果你不想订阅的时候,那你就可以根据他给你返回的收据,进行取消订阅 (unsubscribe(收据))