weakmap 可为 dom 元素绑定不阻塞 gc 的埋点状态，因其键为弱引用的对象（如 element），元素移除后状态自动释放；需用全局实例存储、仅支持对象作 key、不可遍历，适配 intersectionobserver 与 mutationobserver 实现自动清理和动态初始化。
WeakMap 可以在前端埋点 SDK 中为 DOM 元素绑定独立、不阻止 GC 的统计状态，核心在于利用其键必须是对象（如 Element）、且键是弱引用的特性——元素被移除时，对应的状态自动释放，避免内存泄漏。
用 WeakMap 存储每个元素的埋点状态
不同于 Map 或普通对象，WeakMap 的 key 是弱引用。把 DOM 元素作为 key，统计字段（如点击次数、曝光时长、是否已上报）作为 value，即可实现“元素在哪，状态就在哪；元素销毁，状态自动消失”。
- 初始化一个全局 WeakMap 实例：const elementStats = new WeakMap();
- 首次监听某个元素（如带 data-track 的按钮）时，检查它是否已有状态：if (!elementStats.has(el)) { elementStats.set(el, { clickCount: 0, exposedAt: 0, reported: false }); }
- 后续事件中直接读写：const stats = elementStats.get(el); stats.clickCount++;
配合 IntersectionObserver 实现曝光埋点的自动清理
曝光埋点常需记录元素是否进入视口、停留时长等。若用普通对象保存状态，即使元素已被 removeChild 或替换，状态仍残留。WeakMap 天然适配这种场景：
Alibabacloud Sdk Client Initialization For Java
下载
在 Java 中初始化和管理阿里云 SDK客户端。包括单例模式、线程安全、endpoint 与 region 配置、VPC 终端节点、同步与异步等。
- 在 observe 回调中获取元素状态：const stats = elementStats.get(entry.target) || { exposedAt: 0, duration: 0 };
- 进入视口时记录时间：if (entry.isIntersecting && !stats.exposedAt) stats.exposedAt = Date.now();
- 离开视口时计算并暂存时长：if (!entry.isIntersecting && stats.exposedAt) { stats.duration += Date.now() - stats.exposedAt; stats.exposedAt = 0; }
- 元素从 DOM 移除后，无需手动 delete —— WeakMap 自动解绑
避免常见误用：不能遍历、不能用非对象作 key
WeakMap 不支持 keys()、values()、entries()，也不能用字符串、数字或 null 当 key。这既是限制，也是保障：
- 不要试图“批量上报所有待上报元素”——应由业务方主动触发（如页面卸载前调用 sdk.flush()，此时只遍历已知元素列表，再通过 WeakMap 查状态）
- 切勿写 elementStats.set('btn-login', {...}) —— 会报错；必须传真实 DOM 节点
- 服务端渲染（SSR）或动态插入的元素，只要持有其引用（例如通过 querySelector 获取），就可正常 set/get
与 MutationObserver 协同，处理动态节点
对于 SPA 中频繁增删的元素（如列表项），可结合 MutationObserver 自动初始化新节点的状态：
- 监听子节点变动，过滤出新增的、带埋点属性（如 data-track="product-item"）的元素
- 对每个新元素执行：elementStats.set(el, { viewCount: 1, lastViewTime: Date.now() });
- 后续点击/曝光逻辑复用同一 WeakMap 实例，无需关心生命周期管理
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
