閉包的應用
Js的閉包是一個很重要的概念,我的理解他有點像設計模式,他是一種思想,並不是js本身的機制。
下面介紹一下今天利用這個概念實現的需求。
需求:我們需要對一個dom元素繫結一個事件,並傳入引數。
我們來看下正常的寫法
$('#xxxx').bind('click',function(i,j){alert(i+j);});
這樣做是可以實現功能的,但問題是如果函式體的內容太多,或者繫結的控制元件有很多,程式碼不太美觀而且不便於管理。
這時候我們想到另外一種寫法:
$('#xxxx').bind('click',test(i,j));
function test(i,j){
alert(i+j);
}
這樣的寫法看上去沒毛病,其實是不可行的。
那難道我們只能用第一種方法了嗎?
答案是否定的,下面用閉包來實現。
首先閉包的思想是讓內部函式的生命週期比外部函式長,那就意味著內部的函式得是申明,且需要被外部變數接收。所以,我們利用這一點,可以實現上面的需求,程式碼如下:
<div class='aaa' >點我</div>
<div class='bbb' >再點我</div>
<script type="text/javascript">
var action = new Array(2);
function aaa(i,j,g,b,k){
action[0] = function bbb(){
console.log(i+j);
}
action[1] = function ccc(){
console.log(b*(k.attr('val')));
}
}
$(function(){
aaa(4,6,5,7,$('.bbb'));
$('.aaa').bind('click',action[0]);
$('.bbb').bind('click',action[1]);
})
</script>
這就是閉包的一個簡單應用。