1. 程式人生 > >閉包的應用

閉包的應用

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>

這就是閉包的一個簡單應用。