简析createDelegate
关于回调函数指定参数问题,由来已久,extjs简洁优雅完美的解决了这个问题,今天来学习⼀下(不推荐 createCallback )createDelegate ( [Object obj ] , [Array args ] , [Boolean/Number appendArgs ]  ) : Function
返回⼀个函数, 这个函数调⽤原函数,原函数中的this指向obj ,关于这个函数的参数由 appendArgs 指定 :
如 ateDelegate(obj,args,appendArgs);
function2 call function1 ,function1 中的 this == obj
1. appendArgs falsy
那么调⽤ function2时传的参数被忽略,args数组参数作为function1的参数运⾏。
2. appendArgs === true
那么 调⽤ function2时传的参数放在args数组前⾯合成⼀个新的数组,作为function1的参数运⾏。
假设 调⽤ function2时传的参数 为 array1 (注意要 slice 为 真正的 Array)
那么将 args 数组插⼊到 array1 的指定 appendArgs位置 (利⽤ splice( appendArgs,0 ))
然后再把最终数组 作为function1的参数运⾏。
⽰例使⽤代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="/1999/xhtml" lang="en" xml:lang="en">
<head>
<title>createDelegate测试</title>
<script type="text/javascript" src="javascript/ext-base.js"></script>
<script type="text/javascript" src="javascript/ext-core.js"></script>
<script type="text/javascript">
//<![CDATA[
function action_ba(info) {
alert(this.dom.innerHTML);
alert(info);
}
function action_bb(e,this_,o,info) {
alert(this.dom.innerHTML);
pe+'  '+info);
}
function action_bc(info,e) {
alert(this.dom.innerHTML);typeof array
alert(info +'  '+e.type);
}
<('action_a').on('click',('action_a'),['⾃定义参数覆盖event系列参数'])); ('action_b').on('click',('action_b'),['⾃定义参数在最后'],true));
<('action_c').on('click',('action_c'),['⾃定义参数在第⼀位'],0));
});
//]]>
</script>
</head>
<body>
<button id='action_a'> 测试覆盖参数</button>
<button id='action_b'> 测试添加参数</button>
<button id='action_c'> 测试插⼊参数</button>
</body>
</html>
附录:Extjs 实现代码
ateDelegate = function(obj, args, appendArgs){        var method = this;
return function() {
var callArgs = args || arguments;
if(appendArgs === true){
callArgs = Array.prototype.slice.call(arguments, 0);
callArgs = at(args);
}else if(typeof appendArgs == "number"){
callArgs = Array.prototype.slice.call(arguments, 0);
// copy arguments first
var applyArgs = [appendArgs, 0].concat(args);
// create method call params
Array.prototype.splice.apply(callArgs, applyArgs);
// splice them in
}
return method.apply(obj || window, callArgs);
};
}

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。