深入浅出 妙用Javascript中apply、call、bind
apply、call
在 javascript 中,call 和 apply 都是为了改变某个函数运行时的上下文(context)而存在的,换句话说,就是为了改变函数体内部 this 的指向。
JavaScript 的一大特点是,函数存在「定义时上下文」和「运行时上下文」以及「上下文是可以改变的」这样的概念。
先来一个栗子:
1
2
3
4
5
6
7
8
9
10
11
|
function
fruits() {}
fruits.prototype = {
color:
"red"
,
say:
function
() {
console.log(
"My color is "
+
this
.color);
}
}
var
apple =
new
fruits;
apple.say();
//My color is red
|
但是如果我们有一个对象banana= {color : "yellow"} ,我们不想对它重新定义 say 方法,那么我们可以通过 call 或 apply 用 apple 的 say 方法:
1
2
3
4
5
|
banana = {
color:
"yellow"
}
apple.say.call(banana);
//My color is yellow
apple.say.apply(banana);
//My color is yellow
|
所以,可以看出 call 和 apply 是为了动态改变 this 而出现的,当一个 object 没有某个方法(本栗子中banana没有say方法),但是其他的有(本栗子中apple有say方法),我们可以借助call或apply用其它对象的方法来操作。
apply、call 的区别
对于 apply、call 二者而言,作用完全一样,只是接受参数的方式不太一样。例如,有一个函数定义如下:
1
2
3
|
var
func =
function
(arg1, arg2) {
};
|
就可以通过如下方式来调用:
<table border="0" cellpa