安全使用 removeEventListener 必须传入与 addEventListener 完全相同的函数引用、事件类型和选项；避免匿名/箭头函数，需用具名函数或保存引用，并确保 capture、once 等选项严格一致。

要安全使用 removeEventListener，关键在于：**必须传入与 addEventListener 完全相同的函数引用、事件类型和选项（包括 capture 和 once）**。匿名函数、箭头函数或每次新建的函数都无法被正确解绑。

避免使用匿名函数或箭头函数注册监听器

匿名函数每次调用都会创建新引用，removeEventListener 找不到原始函数，导致解绑失败。

❌ 错误示例：

btn.addEventListener('click', () => { console.log('clicked'); });<br>btn.removeEventListener('click', () => { console.log('clicked'); }); // ❌ 无效：两个箭头函数不是同一引用

✅ 正确做法：使用具名函数或保存函数引用

function handleClick() { console.log('clicked'); }<br>btn.addEventListener('click', handleClick);<br>btn.removeEventListener('click', handleClick); // ✅ 成功解绑

注意事件选项必须严格一致

如果添加监听器时用了 { capture: true } 或 { once: true }，移除时也必须传入完全相同的对象（不是“等价”对象，而是同一对象引用或相同布尔值）。

jm-jsjkxyjs02-zlm-405

使用约定式提交（Conventional Commits）生成标准化的 Git 提交信息。适用于以下场景： (1) 暂存更改时需要提交信息； (2) 审查 diff 时希望获得结构化摘要； (3) 编写 PR 描述或变更日志（changelog）条目； (4) 用户明确要求“为本次更改编写提交信息”。 该功能会分析已暂存/未暂存的 diff，并生成按类型（type）划分范围的提交信息。

下载

// 添加时用了 capture: true<br>btn.addEventListener('click', handler, { capture: true });<br>// 移除时必须显式指定 capture: true<br>btn.removeEventListener('click', handler, { capture: true }); // ✅<br>// 下面这行不会生效：<br>btn.removeEventListener('click', handler); // ❌ 缺少 capture: true

⚠️ 注意：{ capture: true } 和 { capture: true, passive: false } 虽逻辑等价，但对象引用不同，removeEventListener 不会匹配。推荐只传必要选项，或复用同一配置对象。

对 once 监听器无需手动移除（但可提前取消）

设置了 once: true 的监听器会在首次触发后自动清理，一般不需手动 removeEventListener。但若想在触发前主动取消，仍需按规则传入相同参数：

const handler = () => console.log('run once');<br>btn.addEventListener('click', handler, { once: true });<br>// 想提前取消？可以：<br>btn.removeEventListener('click', handler, { once: true }); // ✅

实用技巧：封装可解绑的监听器

为简化管理，可封装一个返回“解绑函数”的工具：

function on(target, type, listener, options) {<br>  target.addEventListener(type, listener, options);<br>  return () => target.removeEventListener(type, listener, options);<br>}<br>// 使用：<br>const off = on(btn, 'click', handleClick);<br>// 后续随时调用：<br>off(); // ✅ 安全解绑