学习JavaScript call, apply方法

JavaScript 中通过call或者apply用来代替另一个对象调用一个方法，将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。简单的说就是改变函数执行的上下文，这是最基本的用法。

对于apply、call二者而言，作用完全一样（改变函数内部this的指向），只是接受参数的方式不太一样。

var func=function(arg1,arg2){
   //内容
}
func.call(obj,arg1,arg2) //call第一个参数传对象，可以是null。                                                                   
func.apply(obj,[arg1,arg2])  //apply第一个参数传对象，第二个参数可以是数组或者arguments对象。

1. 示例

function Person(name, age) {
    this.name = name;
    this.age = age;
    this.alertName = function () {
        alert(this.name);
    }
}
		 
function Student(name, age, sex) {
    Person.apply(this, arguments); // 或者 Person.call(this, name, age);
    this.sex = sex;			
}
var student = new Student("pp", 25, "女");
student.alertName();//pp
alert("name:"+student.name+"\n"+"age:"+student.age+"\n"+"grade:"+student.sex);

这样Student类就继承Person类，Person.call(this,name,age) 的意思就是使用 Person构造函数（也是函数）在this对象下执行，那么 Student就有了Person的所有属性和方法，student对象就能够直接调用Person的方法以及属性了;

2. apply的一些其他巧妙用法

细心的人可能已经察觉到,在我调用apply方法的时候,第一个参数是对象(this), 第二个参数是一个数组集合, 在调用Person的时候,他需要的不是一个数组,但是为什么他给我一个数组我仍然可以将数组解析为一个一个的参数,这个就是apply的一个巧妙的用处,可以将一个数组默认的转换为一个参数列表([param1,param2,param3] 转换为 (param1,param2,param3) 这个如果让我们用程序来实现将数组的每一个项,来装换为参数的列表,可能都得费一会功夫,借助apply的这点特性,所以就有了以下高效率的方法:

a)Math.max 可以实现得到数组中最大的一项
因为Math.max 参数里面不支持Math.max([param1,param2]) 也就是数组 ,
但是它支持Math.max(param1,param2,param3…),所以可以根据刚才apply的那个特点来解决 var max=Math.max.apply(null,array),这样轻易的可以得到一个数组中最大的一项  (apply会将一个数组装换为一个参数接一个参数的传递给方法)
这块在调用的时候第一个参数给了一个null,这个是因为没有对象去调用这个方法,我只需要用这个方法帮我运算,得到返回的结果就行,.所以直接传递了一个null过去。

var numbers=[5,258,120,-215];
var maxInNumbers=Math.max.apply(null,numbers),
minInNumbers=Math.min.apply(null,numbers);
alert("max:"+maxInNumbers+"---min:"+minInNumbers);

b)Math.min 可以实现得到数组中最小的一项

同样和 max是一个思想 var min=Math.min.apply(null,array);

c)Array.prototype.push 可以实现两个数组合并

同样push方法没有提供push一个数组,但是它提供了push(param1,param,…paramN) 所以同样也可以通过apply来装换一下这个数组,即:

也可以这样理解,arr1调用了push方法,参数是通过apply将数组装换为参数列表的集合.

var arr1=new Array("1","2","3");   
var arr2=new Array("4","5","6");   
Array.prototype.push.apply(arr1,arr2);  
console.log(arr1)

代码在线工具箱：http://www.matools.com/

学习JavaScript call, apply方法

猜你喜欢