当前位置: 首页 > news >正文

JavaScript设计模式之发布-订阅模式

发布者和订阅者完全解耦(通过消息队列进行通信)
在这里插入图片描述
适用场景:功能模块间进行通信,如Vue的事件总线。
ES6实现方式:

class eventManager {constructor() {this.eventList = {};}on(eventName, callback) {if (this.eventList[eventName]) {this.eventList[eventName].push(callback);} else {this.eventList[eventName] = [callback];}}fire(eventName, data) {if (eventName in this.eventList &&Array.isArray(this.eventList[eventName])) {this.eventList[eventName].forEach(callback => callback(data));} else {console.log(`${eventName} is not a resgisted event`);}}off(eventName, callback) {if (callback) {if (eventName in this.eventList &&Array.isArray(this.eventList[eventName])) {let index = this.eventList[eventName].indexOf(callback);index > -1 && this.eventList[eventName].splice(index, 1);} else {console.log(`${eventName} has not been listen`);}} else {delete this.eventList[eventName]}}
}
let eventManager1 = new eventManager();
eventManager1.on("event", data => {console.log(data);
});
eventManager1.fire("event", "haha");
eventManager1.off("event");

相关文章:

JavaScript设计模式之发布-订阅模式

发布者和订阅者完全解耦(通过消息队列进行通信) 适用场景:功能模块间进行通信,如Vue的事件总线。 ES6实现方式: class eventManager {constructor() {this.eventList {};}on(eventName, callback) {if (this.eventL…...

mysql---索引

概要 索引:排序的列表,列表当中存储的是索引的值和包含这个值的数据所在的行的物理地址 作用:加快查找速度 注:索引要在创建表时尽量创建完全,后期添加影响变动大。 索引也需要占用磁盘空间,innodb表数据…...

微信小程序——简易复制文本

在微信小程序中,可以使用wx.setClipboardData()方法来实现复制文本内容的功能。以下是一个示例代码: // 点击按钮触发复制事件 copyText: function() {var that this;wx.setClipboardData({data: 要复制的文本内容,success: function(res) {wx.showToa…...

【51单片机】矩阵键盘与定时器(学习笔记)

一、矩阵键盘 1、矩阵键盘概述 在键盘中按键数量较多时,为了减少I/O口的占用,通常将按键排列成矩阵形式 采用逐行或逐列的“扫描”,就可以读出任何位置按键的状态 2、扫描的概念 数码管扫描(输出扫描):…...

vue 中使用async await

在程序中使用同步的方式来加载异步的数据的方式: async function() {let promise new Promise((resolve, reject) > {resolve(res);}).then(re > {return re; });await promise; }...

C语言学习之内存区域的划分

内存区域的划分:32位OS可以访问的虚拟内存空间为0~4G;一、内核空间:3~4G;二、用户空间0~3G;栈区:局部变量在栈区分配、由OS负责分配和回收堆区:由程序员手动分配(malloc函数)和回收(free函数);静…...

Unity Animator cpu性能测试

测试案例: 场景中共有4000个物体,挂在40个animtor 上,每个Animator控制100个物体的动画。 使用工具: Unity Profiler. Unity 版本: unity 2019.4.40f1 测试环境: 手机 测试过程: 没有挂…...

数据结构 - 顺序表ArrayList

目录 实现一个通用的顺序表 总结 包装类 装箱 / 装包 和 拆箱 / 拆包 ArrayList 与 顺序表 ArrayList基础功能演示 add 和 addAll ,添加元素功能 ArrayList的扩容机制 来看一下,下面的代码是否存在缺陷 模拟实现 ArrayList add 功能 add ind…...

【Echarts】玫瑰饼图数据交互

在学习echarts玫瑰饼图的过程中,了解到三种数据交互的方法,如果对您也有帮助,不胜欣喜。 一、官网教程 https://echarts.apache.org/examples/zh/editor.html?cpie-roseType-simple (该教程数据在代码中) import *…...

k8s、pod

Pod k8s中的port【端口:30000-32767】 port :为Service 在 cluster IP 上暴露的端口 targetPort:对应容器映射在 pod 端口上 nodePort:可以通过k8s 集群外部使用 node IP node port 访问Service containerPort:容…...

一天掌握python爬虫【基础篇】 涵盖 requests、beautifulsoup、selenium

大家好,我是python222小锋老师。前段时间卷了一套 Python3零基础7天入门实战 以及1小时掌握Python操作Mysql数据库之pymysql模块技术 近日锋哥又卷了一波课程,python爬虫【基础篇】 涵盖 requests、beautifulsoup、selenium,文字版视频版。1…...

睿趣科技:想知道开抖音小店的成本

随着互联网的发展,越来越多的人开始尝试通过开设网店来创业。抖音作为目前最受欢迎的短视频平台之一,也提供了开店的功能。那么,开一家抖音小店需要多少成本呢? 首先,我们需要了解的是,抖音小店的开店费用是…...

python项目部署代码汇总:目标检测类、人体姿态类

一、AI健身计数 1、图片视频检测 (cpu运行): 注:左上角为fps,左下角为次数统计。 1.哑铃弯举:12,14,16 详细环境安装教程:pyqt5AI健身CPU实时检测mediapipe 可视化界面…...

力扣每日一题92:反转链表||

题目描述&#xff1a; 给你单链表的头指针 head 和两个整数 left 和 right &#xff0c;其中 left < right 。请你反转从位置 left 到位置 right 的链表节点&#xff0c;返回 反转后的链表 。 示例 1&#xff1a; 输入&#xff1a;head [1,2,3,4,5], left 2, right 4 输…...

Vue+OpenLayers从入门到实战进阶案例汇总目录,兼容OpenLayers7和OpenLayers8

本篇作为《VueOpenLayers入门教程》和《VueOpenLayers实战进阶案例》所有文章的二合一汇总目录&#xff0c;方便查找。 本专栏源码是由OpenLayers结合Vue框架编写。 本专栏从Vue搭建脚手架到如何引入OpenLayers依赖的每一步详细新手教程&#xff0c;再到通过各种入门案例和综合…...

C#中使用LINQtoSQL管理SQL数据库之添加、修改和删除

目录 一、添加数据 二、修改数据 三、删除数据 四、添加、修改和删除的源码 五、生成效果 1.VS和SSMS原始记录 2.删除ID2和5的记录 3.添加记录ID2、5和8 4.修改ID3和ID4的记录 用LINQtoSQL管理SQL Server数据库时&#xff0c;主要有添加、修改和删除3种操作。 项目中创…...

飞致云及其旗下1Panel项目进入2023年第三季度最具成长性开源初创榜单

2023年10月26日&#xff0c;知名风险投资机构Runa Capital发布2023年第三季度ROSS指数&#xff08;Runa Open Source Startup Index&#xff09;。ROSS指数按季度汇总并公布在代码托管平台GitHub上年化增长率&#xff08;AGR&#xff09;排名前二十位的开源初创公司和开源项目。…...

Maven实战-私服搭建详细教程

Maven实战-私服搭建详细教程 1、为什么需要私服 首先我们为什么需要搭建Maven私服&#xff0c;一切技术来源于解决需求&#xff0c;因为我们在实际开发中&#xff0c;当我们研发出来一个 公共组件&#xff0c;为了能让别的业务开发组用上&#xff0c;则搭建一个远程仓库很有…...

uniapp-自定义表格,右边操作栏固定

uniapp-自定义表格&#xff0c;右边操作栏固定 在网上找了一些&#xff0c;没找到特别合适的&#xff0c;收集了一下其他人的思路&#xff0c;基本都是让左边可以滚动&#xff0c;右边定位&#xff0c;自己也尝试写了一下&#xff0c;有点样式上的小bug&#xff0c;还在尝试修…...

基于Electron27+React18+ArcoDesign客户端后台管理EXE

基于electron27.xreact18搭建电脑端exe后台管理系统模板 electron-react-admin 基于electron27整合vite.jsreact18搭建桌面端后台管理程序解决方案。 前几天有分享electron27react18创建跨平台应用实践&#xff0c;大家感兴趣可以去看看。 https://blog.csdn.net/yanxinyun1990…...

Chord视频分析工具实操手册:预览区播放控制与分析结果同步验证

Chord视频分析工具实操手册&#xff1a;预览区播放控制与分析结果同步验证 1. 工具概览与核心价值 Chord视频时空理解工具是一款基于Qwen2.5-VL架构开发的本地智能视频分析解决方案。这个工具专门针对视频内容分析需求设计&#xff0c;能够在完全离线的环境下对视频进行深度理…...

告别SSH一息屏就断连!用Termux-wake-lock让你的手机后台稳定运行

告别SSH一息屏就断连&#xff01;用Termux-wake-lock让你的手机后台稳定运行 你是否遇到过这样的场景&#xff1a;正通过电脑SSH连接到手机的Termux环境进行开发调试&#xff0c;突然一个微信消息弹出&#xff0c;切出去回复后&#xff0c;SSH连接立刻中断&#xff1f;或是手机…...

nnUNet实战:如何根据你的显卡显存,手动调整batch_size和patch_size(附代码)

nnUNet显存优化实战&#xff1a;精准调整batch_size与patch_size的黄金法则 当你第一次在本地运行nnUNet训练脚本时&#xff0c;看到那个刺眼的CUDA out of memory错误&#xff0c;是不是有种功亏一篑的挫败感&#xff1f;别担心&#xff0c;这不是你的代码问题&#xff0c;而是…...

OpenClaw对接Qwen3-4B实战:5步完成本地模型调用与自动化任务

OpenClaw对接Qwen3-4B实战&#xff1a;5步完成本地模型调用与自动化任务 1. 为什么选择OpenClawQwen3-4B组合 去年冬天第一次听说OpenClaw时&#xff0c;我正被重复性的文件整理工作折磨得焦头烂额。作为一个习惯用脚本解决问题的开发者&#xff0c;我试过各种自动化工具&…...

PowerToys Image Resizer:告别繁琐,三秒搞定图片批量处理

PowerToys Image Resizer&#xff1a;告别繁琐&#xff0c;三秒搞定图片批量处理 【免费下载链接】PowerToys Microsoft PowerToys is a collection of utilities that supercharge productivity and customization on Windows 项目地址: https://gitcode.com/GitHub_Trendin…...

【原创改进代码】考虑电动汽车移动储能特性的多区域电网功率波动平抑优化调控附python代码

✅作者简介&#xff1a;热爱科研的Matlab仿真开发者&#xff0c;擅长毕业设计辅导、数学建模、数据处理、建模仿真、程序设计、完整代码获取、论文复现及科研仿真。 &#x1f34e; 往期回顾关注个人主页&#xff1a;Matlab科研工作室 &#x1f447; 关注我领取海量matlab电子…...

seo sem公司如何制定营销策略

SEO SEM公司如何制定有效的营销策略 在当今数字化时代&#xff0c;SEO&#xff08;搜索引擎优化&#xff09;和SEM&#xff08;搜索引擎营销&#xff09;已经成为企业推广和品牌建立的关键组成部分。无论是中小企业还是大型跨国公司&#xff0c;它们都需要高效、精准的营销策略…...

数字记忆自主化:GetQzonehistory技术架构与数据保护实践指南

数字记忆自主化&#xff1a;GetQzonehistory技术架构与数据保护实践指南 【免费下载链接】GetQzonehistory 获取QQ空间发布的历史说说 项目地址: https://gitcode.com/GitHub_Trending/ge/GetQzonehistory 一、技术演进视角下的数据脆弱性危机 数字存储技术的迭代速度与…...

2.2.2.3 Spark实战:词频统计

本次实战涵盖了Spark词频统计&#xff08;WordCount&#xff09;的两种主流实现方式。首先&#xff0c;利用Scala在spark-shell中完成从读取文件、flatMap分词、map映射到reduceByKey聚合的完整流程&#xff0c;并实现结果的降序排序。其次&#xff0c;针对Spark 3.3.2版本的需…...

新手零基础入门:通过快马生成burpsuite超详细安装图解教程

作为一名网络安全新手&#xff0c;第一次接触BurpSuite时确实容易被各种专业术语和复杂的安装步骤吓到。今天我就用最直白的方式&#xff0c;手把手带你完成BurpSuite的安装&#xff0c;让你轻松迈出Web安全测试的第一步。 什么是BurpSuite&#xff1f;为什么需要它&#xff1…...