谈谈闭包和闭包的使用场景?
什么是闭包?
闭包是作用域的特殊应用
触发闭包的情况
- 函数当做返回值被返回时
- 函数当成参数被传参
- 自执行匿名函数
// 情况1 函数当做返回值被返回 结果:1
function fn(){
const a = 1;
return function(){
console.log(a);
}
}
const a = 5;
const cb = fn();
cb();
// 情况2 函数当做参数传参 结果:500
function fn(cb){
const a = 100;
cb()
}
const a = 500;
fn(function(){
console.log(a);
})
// 情况3 自执行匿名函数 结果:10
(function(index){
console.log(index);
})(10)
闭包的应用?
1.解决for i 的问题(点击按钮出现对应的值)
此处for循环当页面一加载出来就执行完毕,i立马会变成5。但是我们的需求是点击对应按钮出现对于的按钮的值。
此处可以用到闭包来解决或者let产生块级作用域
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>闭包应用1</title>
</head>
<body>
<button>1</button>
<button>2</button>
<button>3</button>
<button>4</button>
<button>5</button>
<script>
const Btn = document.getElementsByTagName("button")
// 第一种解法
for (var i = 0; i < Btn.length; i++) {
(function (index) {
Btn[i].onclick = function () {
console.log(index);
}
})(i)
}
// 第二种解法
// for(let i = 0;i<Btn.length;i++){
// Btn[i].onclick = function(){
// console.log(i);
// }
// }
</script>
</body>
</html>
- 隐藏变量
// 隐藏变量
function fn(){
const data = {} // data 被隐藏掉了
return{
set: function(key,val){
data[key] = val
},
get: function(key){
return data[key]
}
}
}
const json = fn()
json.set('age',18)
console.log(json.get('age'));
作用域
全局作用域、局部作用域
自由变量
不在作用域里的变量,就是自由变量,自由变量的值,在函数定义的地方向上层作用域去查找,与函数调用位置无关
垃圾回收机制是什么?
垃圾回收机制是引用数据类型,例如函数在创建的时候会在内存占用一些空间,当函数执行完毕,内存就会释放
为什么会出现内存泄漏?
内存泄漏就是因为变量在内存中,并且这个变量一直被引用。垃圾回收机制不能被回收
如何解决内存泄漏?
1.闭包
2.Vue全局变量
3.Echarts