JS中的闭包
程序员文章站
2024-01-02 19:09:28
JS中的闭包准备1.JS中的垃圾回收机制JavaScript解释器有自己的内存管理机制，可以自动对内存进行垃圾处理(garbage collection),当不再有任何引用指向一个对象，解释器就知道这个对象没用了，然后自动回收它所占用的资源。2. 变量作用域JavaScript中变量分为：全局变量和局部变量2.1. JavaScript中在函数内部可以访问全局变量var a=12;function fun1(){ console.log(a);}fun1();//122.2....
JS中的闭包
准备
1.JS中的垃圾回收机制
JavaScript解释器有自己的内存管理机制，可以自动对内存进行垃圾处理(garbage collection),当不再有任何引用指向一个对象，解释器就知道这个对象没用了，然后自动回收它所占用的资源。
2. 变量作用域
JavaScript中变量分为：全局变量和局部变量
2.1. JavaScript中在函数内部可以访问全局变量
var a=12;
function fun1(){
console.log(a);
}
fun1();//12
2.2. JavaScript中在函数外部访问不到函数内部的局部变量
function fun2(){
var a=5;
}
console.log(a);//Uncaught ReferenceError: a is not defined
2.3.JavaScript语言中有作用域链结构（chain scope）子对象会一级一级向上寻找所有父对象的变量，所以父对象的所有变量，对子对象都是可见的
3.闭包的使用场景
3.1.setTimeout
setTimeout的第一个参数是将要执行的函数，第二个参数是等待的时间，原生的setTimeout传递的第一个函数不能带参数 ，利用闭包可以实现传参
function fun(a){
return function(){
console.log(a)
}
}
var f1=fun(5)
setTimeout(f1,1000);
#### 3.2.利用闭包访问私有函数和私有变量
var fun=(function(){
var a=100;
function change(val){
a+=val;
}
return{
increment:function(){
change(1);
},
decrement:function(){
change(-1);
},
value:function(){
return a;
}
};
})();
console.log(fun.value());//100
fun.increment()
console.log(fun.value());//101
fun.increment()
console.log(fun.value());//102
3.3. 利用闭包为节点循环绑定点击事件
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<link rel="stylesheet" href="">
</head>
<body>
<p id="student">XXX</p>
<p>姓名： <input type="text" id="name" name="name"></p>
<p>年龄： <input type="text" id="age" name="age"></p>
<p>身高： <input type="text" id="tall" name="tall"></p>
<script>
function fill(smsg){
document.getElementById('student').innerHTML = smsg;
};
function setMsg(){
var info = [
{'id':'name','content':'易烊千玺'},
{'id':'age','content':'18'},
{'id':'tall','content':'180cm'},
];
for (var i = 0; i < info.length; i++) {
var item = info[i];
document.getElementById(item.id).onfocus = function(){
fill(item.content)
}
}
}
setContent()
本文地址：https://blog.csdn.net/Amazing_rabbit/article/details/109249603