JS中的闭包

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 = "学生信息";
	};

	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)
			}
		}
	}
	setMsg()

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值