JS编程建议——59:推荐动态调用函数

建议59:推荐动态调用函数
调用函数更便捷的方式是使用Function对象的call和apply方法。apply与call方法在本质上没有太大区别,只不过它们传递给函数的参数方式不同, apply是以数组形式进行参数传递,而call方法可以同时传递多个值。
如果某个函数仅能够接收多个参数列表,而现在希望把一个数组的所有元素作为参数进行传递,那么使用apply方法就显得非常便利。
function max(){

var m = Number.NEGATIVE_INFINITY; // 声明一个负无穷大的数值
for( var i = 0; i < arguments.length; i ++ ){
    if( arguments[i] > m )
    m = arguments[i];
}
return m;

}
var a = [23, 45, 2, 46, 62, 45, 56, 63];
var m = max.apply( Object, a );
alert( m ); //63
在上面的示例中,首先定义一个函数来计算所传递实参的最大值。由于该函数仅能够接收多个数值参数,所以通过apply方法动态调用max()函数,然后把它绑定为Object对象的一个方法,并借机把一个数组传递给它,最后返回此函数的运行值。如果没有apply方法,想使用max()函数来计算数组中最大元素值,就需要把数组的所有元素读取出来,然后再传递给函数,显然这种做法是费力不讨好的。
实际上,也可以把数组元素通过apply方法传递给系统对象Math的max方法来计算数组的最大元素值。
var a = [23, 45, 2, 46, 62, 45, 56, 63]; // 声明并初始化数组
var m = Math.max.apply( Object, a ); // 调用系统函数max
alert( m ); //63
使用call和apply方法可以把一个函数转换为方法传递给某个对象。这种行为只是临时的,函数最终并没有作为对象的方法而存在,当函数被调用后,该对象方法会自动被注销。下面的示例具体地说明了这种行为。
function f(){}
f.call( Object );
Object.f();
call和apply方法能够更改对象的内部指针,即改变对象的this指向的内容,这在面向对象的编程过程中是非常有用的。
var x = "o";
function a(){

this.x = "a";

}
function b(){

this.x = "b";

}
function c(){

alert( x );

}
function f(){

alert( this.x );

}
f(); //字符o,即全局变量x的值。this此时指向window对象
f.call( window ); f.call( new a() ); //字符a,即函数a内部的局部变量x的值。this此时指向函数a
f.call( new b() ); //字符b,即函数b内部的局部变量x的值。this此时指向函数b
f.call( c ); /undefined,即函数c内部的局部变量x的值,但是该函数并没有定义x变量,所以返回没有定义。this此时指向函数c/
通过上面示例的比较,能够很直观地发现,函数f内部的this关键字会随着所绑定的对象不同而指向不同的对象。因此,利用call或apply方法能够改变函数内部指针指向所绑定的对象,从而实现属性或方法继承。
function f(){

this.a ="a";
this.b = function(){
    alert("b");
}

}
function e(){

f.call(this);
alert(a);

}
e() //字符串a
上面的示例说明,如果在函数体内使用call和apply方法动态调用外部函数,并把call和apply方法的第一个参数值设置为关键字this,那么当前函数e将继承函数f的所有成员。使用call和apply方法能够复制调用函数的内部变量给当前函数体,更改了函数f的内部关键字this指向函数e,这样函数e就可以引用函数f的内部成员。
最后,再看一个比较复杂的示例。在这个示例中将演示如何使用apply方法循环更改当前指针,从而实现循环更改函数的结构。
function r( x ){

return ( x );

}
function f( x ){

x[0] = x[0] + ">";
return x;

}
function o(){

var temp = r;
r = function(){
    return temp.apply( this, f( arguments ) );
}

}
function a(){

o();
alert( r( "=" ) );

}
for( var i = 0 ; i < 10; i ++ ){

a();

}
执行上面代码后会看到,提示信息框中的提示信息不断变化。该示例的核心就在于函数o的设计。在这个函数中,首先使用一个临时变量存储函数r。然后修改函数r的结构,在修改的函数r的结构中,通过调用apply方法修改原来函数r的指针指向当前对象,同时执行原函数r,并把执行函数f的值传递给它,从而实现修改函数r的return语句的后半部分信息,即为返回值增加一个前缀字符“=”。这样每次调用函数o时,都会为其增加一个前缀字符“=”,从而形成一种动态的变化效果。
当然,call和apply方法的应用是非常灵活的,在大型JavaScript技术框架中经常会用到它们,利用它们可以实现动态更改对象的指针,从而实现各种复杂的功能。

时间: 2024-09-03 09:42:39

JS编程建议——59:推荐动态调用函数的相关文章

JS编程建议——22:少用函数迭代

建议22:少用函数迭代ECMA-262v4为本地数组对象新增加了一个forEach方法.此方法遍历一个数组的所有成员,并且在每个成员上执行一个函数.在每个元素上执行的函数作为forEach()的参数传进去,并在调用函数时接收3个参数:数组项的值.数组项的索引.数组自身.例如: items.forEach(function(value, index, array){ process(value); }); forEach在Firefox.Chrome和Safari等浏览器中为原生函数.另外,for

JS编程建议——72:惰性载入函数

建议72:惰性载入函数惰性载入函数主要解决的问题也是兼容性,原理跟分支函数类似,下面是简单的示例.var addEvent = function(el, type, handle) { addEvent = el.addEventListener ? function(el, type, handle) { el.addEventListener(type, handle, false); } : function(el, type, handle) { el.attachEvent("on&q

JS编程建议——76:要重视函数节流

建议76:要重视函数节流比起非DOM交互,DOM操作需要更多内存和CPU时间.连续尝试进行过多的DOM相关操作可能会导致浏览器变慢甚至崩溃.函数节流的设计思想就是让某些代码可以在间断情况下连续重复执行,实现的方法是使用定时器对函数进行节流.例如,在第一次调用函数时,创建一个定时器,在指定的时间间隔后执行代码.当第二次调用时,清除前一次的定时器并设置另一个,实际上就是前一个定时器演示执行,将其替换成一个新的定时器.var processor = { timeoutId : null, //实际进行

JS编程建议——23推荐提高条件性能的策略

建议23:推荐提高条件性能的策略与循环相似,条件表达式决定JavaScript 运行流的走向.与其他语言一样,JavaScript也采用了if 和switch 两种条件结构.由于不同浏览器针对流程控制进行了不同的优化,因此两者在性能上并没有特别大的差异,主要还是根据需求形式进行分析和选择:条件数量较大,建议选择switch 结构,而不是if结构,这样可以使代码更易读:如果条件较少时,建议选择if结构. //条件少 if(found) { //执行代码 } else { //执行代码 } //条件

php中动态调用函数的方法_php技巧

本文实例讲述了php中动态调用函数的方法.分享给大家供大家参考.具体分析如下: php中你可以动态调用函数,分为以下步骤: 1. 定义一个函数 2. 将函数名(字符串)赋值给一个变量 3. 使用变量名代替函数名动态调用函数 详细代码如下所示: <?php function addition ($a, $b){ echo ($a + $b), "\n"; } $result = "addition"; $result (3,6); ?> 希望本文所述对大家

php中动态调用函数的方法

 这篇文章主要介绍了php中动态调用函数的方法,实例分析了php动态函数的实现原理与具体实现步骤,需要的朋友可以参考下     本文实例讲述了php中动态调用函数的方法.分享给大家供大家参考.具体分析如下: php中你可以动态调用函数,分为以下步骤: 1. 定义一个函数 2. 将函数名(字符串)赋值给一个变量 3. 使用变量名代替函数名动态调用函数 详细代码如下所示: ? 1 2 3 4 5 6 7 <?php function addition ($a, $b){ echo ($a + $b)

JS编程建议——37:推荐使用replace(2)

建议37:推荐使用replace(2)在上面的示例代码中,函数f()的参数为特殊字符"$1",它表示正则表达式/(bw+b)/中小括号每次匹配的文本.然后在函数体内对这个匹配文本进行处理,截取其首字母并转换为大写形式,之后返回新处理的字符串.replace方法能够在原文本中使用这个返回的新字符串替换每次匹配的子字符串.对于上面的示例,可以使用小括号来获取更多匹配文本的信息.例如,直接利用小括号传递单词的首字母,然后进行大小写转换处理: var s = 'script language

JS编程建议——75:函数柯里化

建议75:函数柯里化柯里化是把接受多个参数的函数变换成接受一个单一参数的函数,并且返回一个新函数,这个新函数能够接受原函数的参数.下面可以通过例子来帮助理解.function adder(num) { return function(x) { return num + x; } }var add5 = adder(5);var add6 = adder(6);print(add5(1)); // 6print(add6(1)); //7函数adder接受一个参数,并返回一个函数,这个返回的函数可

JS编程建议——62:在循环体和异步回调中慎重使用闭包

建议62:在循环体和异步回调中慎重使用闭包闭包在开发中具有重要的应用价值,由于闭包具有持久性,生成的闭包不会立即被销毁,因此它会持续占用系统资源.如果大量使用闭包,将会造成系统资源紧张,甚至导致内存溢出等错误.另外,闭包在回调函数中会带来负面影响,因此在使用时应该慎重.下面的示例利用闭包来存储变量所有变化的值.function f( x ){ var a = []; for ( var i = 0; i < x.length; i ++ ){ var temp = x[i]; a.push( f