IIFE是旧项目中零配置的作用域隔离手段，通过函数作用域切断变量声明、事件绑定、定时器等副作用外溢，确保不污染全局命名空间，所有声明默认私有，全局对象需显式传入。
在非模块化旧项目中，IIFE 是最直接、零配置的作用域隔离手段。它不依赖构建工具或运行时环境，原生 JavaScript 即可生效，特别适合遗留系统、内嵌脚本、CMS 插件或未启用 ES 模块的浏览器环境。
核心目标：切断副作用外溢
副作用包括变量声明、事件监听绑定、定时器启动、全局属性修改、DOM 写入等。IIFE 通过创建新函数作用域，确保这些操作不会污染全局命名空间或干扰其他脚本。
- 所有 var/let/const/function 声明默认私有，外部无法访问
- 全局对象（如
window、document）需显式传入或引用，避免隐式依赖 - 初始化逻辑只执行一次，天然具备“一次性”语义
典型写法与参数传递技巧
推荐使用带参数的括号包裹式，兼顾可读性、调试友好性和环境适配能力：
(function(global, doc, undefined) {
// 避免 undefined 被重写，且便于压缩工具识别
'use strict';
<p>// 私有状态（不泄漏）
let _counter = 0;
const _cache = new Map();</p><p>// 副作用：仅在此作用域内注册事件
doc.addEventListener('DOMContentLoaded', function() {
console.log('IIFE 初始化完成');
});</p><p>// 副作用：启动轮询（但可通过闭包控制）
const timer = setInterval(() => {
_counter++;
if (_counter > 5) clearInterval(timer);
}, 1000);</p><p>// 仅暴露必要接口（可选）
global.MyLegacyWidget = {
getVersion: () => '1.2.0',
reset: () => { _counter = 0; }
};</p><p>})(typeof window !== 'undefined' ? window : this, document);
- 首参传
window或this，兼容 Node.js 环境（如服务端渲染片段） - 显式传
document，避免多次查全局对象，也方便单元测试 mock - 末尾加
undefined形参，防止低版本浏览器中undefined被意外赋值
处理常见副作用场景
针对旧项目高频问题，给出对应模式：
-
循环中绑定正确索引：用 IIFE 捕获
var i的当前值（ES6 之前必需）for (var i = 0; i console.log(idx), 100); })(i); } -
jQuery 插件封装：确保
$指向预期版本，不受其他库影响(function($) { $.fn.highlight = function() { return this.css('background', '#ff0'); }; })(jQuery); -
避免重复执行：检查全局标志位再运行初始化逻辑
if (!window.__MY_INIT_DONE) { /* 执行副作用 */ window.__MY_INIT_DONE = true; }
注意事项与边界提醒
IIFE 不是万能解药，需注意实际限制：
- 无法阻止
global.alert()或console.log()这类全局调用产生副作用 - 若返回对象或函数并长期持有，其闭包会保留内部变量——内存占用需评估
- DOM 操作仍可能触发样式重排、布局抖动等隐式副作用，IIFE 不解决性能问题
- 多个 IIFE 之间无通信机制，如需协作，应通过约定好的全局命名空间（如
window.MyLib）或事件总线
