谈一谈js中call()和apply()方法
在最近看的js书中,提及到了,Math对象,有max和min方法,当我们想要将这个方法适用数组的时候可以这样适用。
var value = [1,2,3,4,5]
var max = Math.max.apply(Math,values);
之前对apply和call的只是知道是一种继承的方式,但是并没有深入,理解,于是我决定仔细研究研究。
call, apply都属于Function.prototype的一个方法,它是JavaScript引擎内在实现的,因为属于Function.prototype,所以每个Function对象实例,也就是每个方法都有call, apply属性.既然作为方法的属性,那它们的使用就当然是针对方法的了.这两个方法是容易混淆的,因为它们的作用一样,只是使用方式不同.
call方法:
语法:call([thisObj[,arg1[, arg2[, [,.argN]]]]])
定义:调用一个对象的一个方法,以另一个对象替换当前对象。
说明:
call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。
如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj。
apply方法
语法:apply([thisObj[,argArray]])
定义:应用某一对象的一个方法,用另一个对象替换当前对象。
说明:
如果 argArray 不是一个有效的数组或者不是 arguments 对象,那么将导致一个 TypeError。
如果没有提供 argArray 和 thisObj 任何一个参数,那么 Global 对象将被用作 thisObj, 并且无法被传递任何参数
相同点:两个方法产生的作用是完全一样的。
不同点:方法传递的参数不同。
function Animation(){
this.name = "Animal";
this.showName = function(){
console.log(this.name);
}
}
function Cat(){
this.name = 'Cat';
}
let cat = new Cat();
let animation = new Animation();
animation.showName.apply(cat);
从结果中可以看出call和apply都可以让Cat对象调用Animation对象的showName方法,并且修改了this的当前作用对象。
画重点
|
每个函数都包含两个非继承而来的方法:apply()和call()。
他们的用途相同,都是在特定的作用域中调用函数。
接收参数方面不同,apply()接收两个参数,一个是函数运行的作用域(this),另一个是参数数组。
call()方法第一个参数与apply()方法相同,但传递给函数的参数必须列举出来
eg:
window.firstName = "diz";
window.lastName = "song";
var myObject = { firstName: "my", lastName: "Object" };
function HelloName() {
console.log("Hello " + this.firstName + " " + this.lastName, " glad to meet you!");
}
HelloName.call(window); //huo .call(this);
HelloName.call(myObject);
运行结果如下:
Hello diz song glad to meet you!
Hello my Object glad to meet you!
其实不难发现apply()和call()的真正用武之地是能够扩充函数赖以运行的作用域
因此在es5中有bind()方法
eg:
window.color = "red";
var o = { color: "blue" };
function sayColor(){
alert(this.color);
}
var OSayColor = sayColor.bind(o);
OSayColor(); //blue