js闭包
# 1. 什么是闭包?
闭包(closure): 可以访问其他函数内部定义的变量的函数。在js中,只有函数内部的子函数才能访问到局部变量,所以,闭包可以理解为"定义在一个函数内部的函数"。在本质上,闭包是将函数内部和函数外部连接起来的桥梁。
# 2. 变量作用域 (opens new window)
理解闭包,首先必须理解变量作用域。JavaScript 有两种作用域:全局作用域和函数作用域。定义在最外层作用域的变量是全局变量 (opens new window),定义在函数内部的变量称为局部变量,由于 JavaScript 的特性,外层的函数无法访问内部函数的变量;而内部函数可以访问外部函数的变量(即作用域链)。
访问全局变量:
let num = 1;
function fn() {
console.log(num);
}
fn(); // 1
12345
1
2
3
4
5
6
2
3
4
5
6
访问局部变量:
function fn() {
let num = 0;
}
fn();
console.log(num); // Uncaught ReferenceError: num is not defined
12345
1
2
3
4
5
6
2
3
4
5
6
# 3. 闭包的特性
- 函数嵌套函数;
- 内部函数可以访问外部函数的变量;
- 被访问的参数和变量不会被JavaScript垃圾回收机制回收(不会被销毁);
简单例子如下:
function fn1() {
let num = 1;
return function fn2() {
return ++num;
}
}
let result = fn1();
console.log(result()); // 2
console.log(result()); // 3
console.log(result()); // 4
console.log(result()); // 5
1234567891011
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
这段代码其实就创建了一个闭包,有函数嵌套,有父函数变量给子函数引用,形成依赖关系,产生闭包环境。执行完const result = fn1()后,变量result 实际上是指向了函数fn2,再执行result ( )后就会返回++num的值。
在这段代码中,当函数fn1执行并将函数fn2返回后,闭包使得Javascript的垃圾回收机制不会收回函数fn1里num变量所占用的资源(不会被销毁),因为fn1的内部函数fn2的执行需要依赖num变量,所以就出现了每次调用result,num就会自增一。
# 4. 闭包的优缺点
优点:
- 保护函数内的变量安全;加强封装性,可以达到对变量的保护作用; 上述函数fn1中num只有函数fn2才能访问,而无法通过其他途径访问到,因此保护了i的安全性。
- 在内存中维持一个变量(js不会销毁;用的太多就变成了缺点,占内存);
- 方便调用上下文的局部变量。
缺点:
- 常驻内存,会增大内存使用量,使用不当很容易造成内存泄露。
- 内存浪费问题,这个内存浪费不仅仅因为它常驻内存,更重要的是,对闭包的使用不当会造成无效内存的产生。
上次更新: 2022/05/12 14:57:53