自定义事件是实现轻量解耦插件系统最直接有效的方式，核心库在关键节点派发语义化命名事件（如core:init-start），插件监听执行逻辑；事件需cancelable、通过detail传参、统一前缀冒号分隔；提供use/registerHooks注册卸载接口，并支持日志、优先级、once等调试增强能力。
自定义事件是实现轻量、解耦插件系统最直接有效的方式。核心库不主动加载或管理插件，而是通过在关键节点（如初始化、渲染前、数据更新后）派发命名明确的自定义事件；插件只需监听这些事件，在对应时机执行逻辑，无需修改核心代码，也不依赖特定插件注册机制。
定义清晰、语义化的生命周期事件名
事件名应体现阶段 + 主体 + 时机，避免模糊缩写。例如：
- core:init-start —— 核心初始化开始前，适合插件注入配置或拦截启动
- widget:render:before —— 某类组件渲染前，可修改待渲染数据
- store:data:updated —— 全局状态更新后，用于触发缓存刷新或日志上报
- core:destroy:cleanup —— 销毁前最后机会，清理定时器、事件监听等副作用
统一前缀（如 core:、widget:）便于过滤和调试；使用冒号分隔层级，比连字符或驼峰更易读、更利于工具识别。
在核心流程中安全派发事件
使用 dispatchEvent 结合 CustomEvent，并确保事件可被取消、可携带数据：
// 示例：在初始化函数中
function init(options) {
const initEvent = new CustomEvent('core:init-start', {
cancelable: true,
detail: { options, timestamp: Date.now() }
});
if (!this.dispatchEvent(initEvent)) return; // 被插件调用 preventDefault() 则中止
// 继续后续初始化...
this.emit('core:init:ready', { instance: this });
}
关键点：
- 对可中断流程（如 init、load）设
cancelable: true，插件可通过event.preventDefault()阻断后续执行 - 用
detail传入上下文对象，而非全局变量或闭包引用，保证插件获取的是当前快照 - 避免在事件处理中直接修改核心内部状态，推荐通过
detail提供的 setter 方法或返回值约定来协作
为插件提供一致的注册与卸载接口
核心库暴露简单方法，让插件声明式绑定钩子，同时支持运行时启用/禁用：
// 核心库提供
class Core {
use(plugin) {
plugin.install(this);
return this;
}
// 或更轻量：直接接受事件监听对象
registerHooks(hooks) {
Object.entries(hooks).forEach(([event, handler]) => {
this.addEventListener(event, handler);
});
return () => {
Object.entries(hooks).forEach(([event, handler]) => {
this.removeEventListener(event, handler);
});
};
}
}
插件示例：
const loggerPlugin = {
install(core) {
core.addEventListener('core:init:ready', () => console.log('✅ 已就绪'));
core.addEventListener('store:data:updated', e => {
console.log('? 数据变更:', e.detail.changes);
});
}
};
core.use(loggerPlugin);
这样插件完全自治，核心无插件元信息负担，也方便单元测试和按需加载。
配套工具：事件调试与优先级控制
开发阶段建议增强事件系统：
- 添加 事件日志开关：
core.enableEventLog(true)，自动打印所有触发/监听的事件名和耗时 - 支持 监听优先级：在
addEventListener扩展参数{ priority: 10 }，高优插件先执行（适用于拦截类钩子） - 提供 一次性钩子：
once('core:destroy:cleanup', handler)，避免重复注册导致内存泄漏
这些能力不改变基础事件模型，只是语法糖，保持向后兼容。
