js進階學習之--閉包
閉包概念：一個函數引用另一個函數中的變量的函數叫做閉包
<script>
//父函數中的變量不會被釋放
function closure(){
var i = 0;
return function(){
alert(i++);
}
}
//將函數的返回值接回
var fn = closure();
var fn2 = closure();
fn(); //返回結果1
fn(); //返回結果2
fn2();//返回結果1
//但是一般的函數，調用一次之後，函數的變量的值就會釋放
function fn01(){
var i = 0;
alert(++i);
}
fn01();//返回結果：1
fn01();//返回結果1
fn01();//返回結果1
</script>
閉包：對外公開調用內部的接口，外部可以調用
function fn01(){
var a = 10;
var b = 100;
return {
fn03:function(){
console.log(a);
},
fn04:function(){
console.log(b);
}
}
}
var fn = fn01();
fn.fn03();
function fn02(){
var a = 10;
function fn03(){
console.log(a);
}
}<pre name="code" class="javascript"><span style="white-space:pre"> </span>var fn = fn02();
fn.fn03();閉包實現li的點擊事件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>閉包3</title>
<script>
window.onload = function(){
var liList = document.getElementsByTagName("li");
for(var i = 0; i < liList.length; i++){
// 第一種方式：
// function fn01(i){
// liList[i].onclick = function(){
// alert(i);
// }
// }
// fn01(i);
// 第二種方式：
// (function(i){
// liList[i].onclick = function(){
// alert(i);
// }
// })(i);
// 第三種方式：
liList[i].onclick = (function(i){
return function(){
alert(i);
}
})(i);
}
}
</script>
</head>
<body>
<ul>
<li>1111111</li>
<li>2222222</li>
<li>3333333</li>
<li>4444444</li>
</ul>
</body>
</html>