返回
立即执行函数的认知
前端
2023-11-11 03:10:01
我们所说的立即执行函数英文是:immediately-invoked function expression,缩写:IIFE 翻译意思就是立即调用的函数表达式 为什么是函数表达式呢? 首先要知道函数声
明和函数表达式, 函数声明是 function + 函数名 + 函数体,而函数表达式则是 function 关键字 + 参数列表 + 函数体。立即执行函数的意思就是, IIFE 的声明和调用同时进行, 不需要单独调用函数了。
当然, 我们完全可以这么做:
function test() {
console.log(1);
}
// 调用
test();
但是如果我们想把 test()
函数里的内容变成局部作用域, 不影响外面的作用域怎么办呢?就可以使用立即执行函数来做。
(function() {
console.log(1);
})();
原理:
立即执行函数的原理很简单, 其实就是利用函数的作用域范围。当一个函数被执行时, 就会创建一个自己的执行上下文, 而这个执行上下文就成了函数的作用域。函数的作用域内, 我们可以访问到函数内部的变量和参数, 但是无法访问外部的作用域。
特点:
- 局部作用域:IIFE 可以创建局部作用域, 将函数内部的变量和参数与外部的作用域隔离开来。
- 隐私性:IIFE 还可以保护函数内部的变量和参数的隐私性, 使它们无法被外部的作用域访问到。
- 避免污染全局作用域:IIFE 可以防止函数内部的变量和参数污染全局作用域, 使代码更加干净和易于维护。
- 模块化:IIFE 可以将代码封装成独立的模块, 使代码更加易于复用和维护。
用法:
IIFE 的用法也很简单, 只需要在函数声明的前面加上一对小括号即可。
(function() {
// 代码
})();
或者也可以使用圆括号来调用函数:
(function() {
// 代码
}());
立即执行函数的优点:
- 可以创建局部作用域, 将函数内部的变量和参数与外部的作用域隔离开来。
- 可以保护函数内部的变量和参数的隐私性, 使它们无法被外部的作用域访问到。
- 可以避免污染全局作用域, 使代码更加干净和易于维护。
- 可以将代码封装成独立的模块, 使代码更加易于复用和维护。
立即执行函数的缺点:
- 可能使代码更难以阅读和理解。
- 可能导致命名冲突, 尤其是当在一个文件中使用了多个立即执行函数时。
- 可能导致内存泄漏, 尤其是当立即执行函数内部的变量和参数被外部的作用域访问到时。
立即执行函数的使用场景:
- 当我们需要创建局部作用域时, 例如, 当我们需要在函数内部访问一些私有变量时。
- 当我们需要保护函数内部的变量和参数的隐私性时, 例如, 当我们需要在函数内部处理一些敏感数据时。
- 当我们需要避免污染全局作用域时, 例如, 当我们需要在多个脚本文件中使用相同的变量和函数时。
- 当我们需要将代码封装成独立的模块时, 例如, 当我们需要在多个项目中复用相同的代码时。