惰性加载函数通过首次调用执行环境检测并重写自身，后续调用直接走优化路径，从而消除重复判断开销；它适用于浏览器兼容性检测等稳定场景，但不适用于需动态响应变化的逻辑。
JavaScript 中惰性加载函数（也称“惰性函数”）优化初始化性能的核心，是把运行时环境检测或一次性配置逻辑，从每次调用都执行，变成只在首次调用时执行并重写自身。它不依赖外部资源加载，而是聚焦于函数内部逻辑的“一次判断、永久生效”。
这种模式特别适合处理浏览器兼容性判断、API 特性检测、全局配置初始化等场景，能直接减少高频调用下的重复开销。
用函数自重写消除重复判断
惰性函数的本质是：
第一次调用 → 执行完整逻辑（含检测 + 初始化）→ 立刻重写函数体为精简版本；
后续调用 → 直接走优化后路径，跳过所有条件分支。
比如事件绑定兼容处理：
function addEvent(element, type, handler) {
if (element.addEventListener) {
// 首次：确定用现代 API，重写函数
addEvent = function(el, t, h) {
el.addEventListener(t, h, false);
};
} else if (element.attachEvent) {
addEvent = function(el, t, h) {
el.attachEvent('on' + t, h);
};
} else {
addEvent = function(el, t, h) {
el['on' + t] = h;
};
}
// 立即执行首次调用
return addEvent(element, type, handler);
}✅ 效果：第 2 次起调用 addEvent，不再做任何 if 判断，直接走对应 API 路径。
立即学习“Java免费学习笔记（深入）”；
关键优化点和注意事项
-
避免闭包污染：重写后的函数应保持参数签名一致，且不依赖外层临时变量（如
element），否则会捕获错误上下文。 -
确保首次调用必走重写逻辑：不能把重写逻辑放在
else或异步回调里，否则可能漏掉。 - 适合高频、稳定环境的场景：比如页面生命周期内浏览器特性不会变，重写一次就足够。
- 不适合需动态响应变化的逻辑：例如用户切换主题后要重新检测 CSS 支持，就不能用惰性函数——它“记死”了第一次的结果。
和“惰性加载（Lazy Loading）”别混淆
| 类型 | 目标 | 触发时机 | 典型手段 |
|---|---|---|---|
| 惰性函数 | 减少重复环境判断开销 | 函数首次被调用时 | 函数自赋值、重写 this 或闭包内函数引用 |
| 惰性加载 | 减少初始资源体积 | 元素进入视口 / 用户交互 / 路由切换时 |
IntersectionObserver、import()、loading="lazy"
|
两者都叫“惰性”，但解决的问题层级不同：一个是运行时逻辑优化，一个是资源调度策略。
不复杂但容易忽略
