各位观众老爷大家好,欢迎收看内裤总动员之程序猿的IT程序大讲堂,今天给大家分享一个小知识点就是自调用函数,也叫闭包.
首先先给大家看一个函数调用的小例子.
function add(){
var cont = 0;
cont++;
console.log(cont);
}
add();
add();
add();
大家可以想一下,add()函数被调用了三次,cont++了三次,他会变成为多少呢?
结果为1
大家是否以为cont会被变为 3 ? 哈哈, 观众老爷们, 一定要注意. 我们的cont是在函数里面声明的哦, 我们每次调用cont的时候他的值每次都被赋值为0. 所以他一值是1. 那么请看下一个例子.
(function (a){
console.log(a);
})(123); //123
结果为123这个就叫闭包. 他的使用方式 就是 ( function() {} )(); 后面的小括号为实参, 而前面的小括号里 写的函数 所需要的参数 是型参. 下面在看一个例子.
var add = (function (){
var count =10;
return function add(){
count++;
console.log(count);
}
})();
add();
add();
add();
add();
结果为11,12,13,14在这个闭包当中,我在里面声明一个函数,并让他return, 这里需要注意. 我如果不在前面 加上 var add 声明一个add接收的话,你是无法直接 用add(); 去调用的. 因为 我们的add()函数 他只能在闭包里面才能够访问到,外面是无法访问的. 所以 我声明了一个add 去接收 这个函数. 也就是相当于我把add()这个函数赋值给了 变量add, 所以我在下面才能够访问add()函数. 并得出里面的值.
下面在给大家举一个例子. for循环点击按钮获取下标. 按照当前的思路就是for循环打出当前的i值即可. 那么观众老爷们请往下看代码.
<body>
<input type="button" value = "按钮1">
<input type="button" value = " 按钮2" >
</body>
我就不写那么多了, 麻蛋, 没法复制粘贴 艹 嗯~~哼~~
<scirpt type = "text/javascript">
var inputs = document.querySelectorAll("input");
for(var i = 0 ; i < inputs.length; i++){
inputs[i].onclick = function(){
alert(i);
}
}
</script>
在上面的代码中我们会以为,在按钮中我们都会显示出我们的当前的i值. 其实不是这样的,i值已经变成了1. 因为我们的循环在做点击事件之前就已经循环完毕了. i值已经变为1. 所以 我们不管点击哪个i的值都是1. 这个是不会变得.
结果都是10
额,抱歉啊,上面的截图我是有10个input. 我没写够.....~~ 回到正题,那么闭包就会解决此问题.
var inputs = document.querySelectorAll("input");
for(var i = 0 ; i < inputs.length; i++){
(function (a){
inputs[a].onclick = function(){
alert(a);
}
})(i);
}
按钮1地址为0我在里面把i值 传输给闭包里面的a, 让a做点击事件, 并打印出a的坐标. 这样我们就获取到了a的坐标值.
好啦,关于闭包的知识点就简单的为大家介绍到这里啦. 感谢各位观众老爷的阅览,如有问题可以评论点评. 谢谢大家~~~~
网友评论