建议15:推荐动态调用函数

  调用函数更便捷的方式是使用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)
console.log(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)
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(){
  console.log('c'+x);
}
function f(){
  console.log('f'+this.x);
}
f();              //字符o,即全局变量x的值.this此时之现象window对象
f.call(window);   //字符o 
f.call(a())   //字符a,即函数a内部的局部变量x的值.this此时指向函数a
f.call(b())   //字符b,即函数b内部的局部变量x的值.this此时指向函数b
f.call(c())   //字符o,函数c内部没有定义局部变量x的值,所以用了全局变量x

  通过上面示例,能直观发现,函数f内部的this关键字会随着所绑定的对象不同而指向不同的对象.因此,历用call或apply方法能够改变内部指针指向所绑定的对象,从而实现属性或方法继承.

function f(){
  this.a = "a";
  this.b = function(){
    console.log('b')
  }
}
function e(){
  f.call(this);
  console.log(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();
  console.log(r("="));
}
for(var i = 0;i<10;i++){
  a()
}
/**
 =>
 =>>
 =>>>
 =>>>>
 =>>>>>
 =>>>>>>
 =>>>>>>>
 =>>>>>>>>
 =>>>>>>>>>
 =>>>>>>>>>>
*/

  执行代码后会看到上面这样,提示信息框中的提示信息不断变化.该示例的核心就在于函数欧的设计.在这个函数中,首先使用一个临时变量存储函数r.然后修改函数r的结构,在修改的函数r的结构中,通过apply方法修改原来函数人的指针指向当前对象,同时执行原函数r,并把执行函数f的值传递给它,从而实现修改函数r的return语句的后半部分信息,即为返回值增加一个前缀字符"=",从而形成一种动态的屙变化效果.

  call和apply方法的应用非常灵活,在大型JavaScript技术框架中经常会用到它们,利用它们可以实现动态更改对象的指针,从而实现各种复杂的功能.

原文地址:https://www.cnblogs.com/chorkiu/p/12107960.html