//函数模式的闭包，在一个函数中有一个函数
function f1() {
var num=10;
function f2() {
console.log(num);
}
f2();
}
f1();
//对象模式的闭包，函数中有一个对象
function f3() {
var num=10;
var obj={
age:num
};
console.log(obj.age);//10
}
f3();
//案例
function f4() {
var num=10;
return function () {
num++;
return num;
}
}
var ff=f4();
console.log(ff());//11
console.log(ff());//12
console.log(ff());//13
//案例：产生多个相同的随机数===数字是相同的
function f1() {
var num=parseInt(Math.random()*10+1);
return function () {
console.log(num);
}
}
var fg=f1();
fg();
fg();
fg();
/*
* 总结：
* 如果想要缓存数据，就把这个数据放在外层的函数和里层的函数的中间位置
*
* 闭包的作用：
* 缓存数据，优点也是缺陷，没有及时释放
*
* 局部变量是在函数中，函数使用结束后，局部变量就会被自动的释放
* 闭包后，里面的局部变量的使用作用域链就会被延长
*
* */
闭包案例，点赞
<style>
ul {
list-style-type: none;
}
li {
float: left;
margin-left: 10px;
}
img {
200px;
height: 180px;
}
input {
margin-left: 30%;
}
</style>
</head>
<body>
<ul>
<li><img src="images/ly.jpg" alt=""><br/><input type="button" value="赞(1)"></li>
<li><img src="images/lyml.jpg" alt=""><br/><input type="button" value="赞(1)"></li>
<li><img src="images/fj.jpg" alt=""><br/><input type="button" value="赞(1)"></li>
<li><img src="images/bd.jpg" alt=""><br/><input type="button" value="赞(1)"></li>
</ul>
<script>
//获取所有标签
//根据标签名字获取元素
function ver(tagName) {
return document.getElementsByTagName(tagName);
}
//闭包缓存数据
function getValue() {
var value=2;
return function () {
//每次点击的时候，都应该改变当前点击按钮的value值
this.value="赞("+(value++)+")";
}
}
//获取所有按钮
var btnObj=ver("input");
//循环遍历每个按钮，注册点击事件
for(var i=0;i<btnObj.length;i++){
//注册事件
btnObj[i].onclick=getValue();
}