函数含义:创建一个 Function ,当这个新的 Function 被调用时,使用给定的 this 值所在的 Context,并且传入给定的参数序列.
函数语法:var bound = fun.bind( thisValue, [, arg1 [, arg2 [ … ] ] ] );
thisValue:当新的 Function 被调用时,thisValue 会付给其 this 值。如果使用 new 操作符调用 Function,则忽略 thisValue。
arg1, arg2, …:当新的 Function 被调用时,当作参数列表传入,插入在调用时实际参数之前。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
| var dog = {
food:'排骨',
eat:function(){return this.food;}
};
//1
var cat = dog.eat.bind({food:'鱼'});
console.log(cat());
//2
var scat = dog.eat.bind(function(){this.food = '小鱼';}());
console.log(scat());
/////////////////////////////////////
function BigDog(){
this.food = '大排骨';
this.eat = function(){return this.food;}
return this;
}
function BigCat(){
this.food = '大鱼';
this.eat = function(){return "吃:"+this.food;}
}
var BigDog2 = new BigDog();
//1
var Bcat1 = BigDog2.eat.bind(BigCat());
console.log(Bcat1());
//2
var Bcat2 = BigDog2.eat.bind(function(){
this.food = '超大鱼';
}());
console.log(Bcat2());
|
结果为:
鱼
小鱼
大鱼
超大鱼
通过这种方式暂时把this绑定在一个方法上,声明时的函数执行,再执行。
如果你的浏览器还不支持bind函数,可以使用一下的代码:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
| if (!Function.prototype.bind) {
Function.prototype.bind = function (oThis) {
if (typeof this !== "function") {
// closest thing possible to the ECMAScript 5 internal IsCallable function
throw new TypeError("Function.prototype.bind - what is trying to be bound is not callable");
}
var aArgs = Array.prototype.slice.call(arguments, 1),
fToBind = this,
fNOP = function () {},
fBound = function () {
return fToBind.apply(this instanceof fNOP && oThis
? this
: oThis,
aArgs.concat(Array.prototype.slice.call(arguments)));
};
fNOP.prototype = this.prototype;
fBound.prototype = new fNOP();
return fBound;
};
}
|