JavaScript 提供了call、apply、bind这三个方法,来切换/固定this的指向。
Function.prototype.call()
函数实例的call方法,可以指定函数内部this的指向(即函数执行时所在的作用域),然后在所指定的作用域中,调用该函数。
var obj = {};
var f = function () {
return this;
};
f() === window // true
f.call(obj) === obj // true
call方法的第一个参数,应该是一个对象(后面的参数则是调用的函数所需要的参数)。如果参数为空、null和undefined,则默认传入全局对象。
var n = 123;
var obj = { n: 456 };
function a() {
console.log(this.n);
}
a.call() // 123
a.call(null) // 123
a.call(undefined) // 123
a.call(window) // 123
a.call(obj) // 456
如果call方法的参数是一个原始值,那么这个原始值会自动转成对应的包装对象,然后传入call方法。
var f = function () {
return this;
};
f.call(5)
// Number {[[PrimitiveValue]]: 5}
Function.prototype.apply()
apply与call用法相同区别在于,第一个参数后面的参数——apply是一个数组
func.call(thisValue, arg1, arg2, ...)
func.apply(thisValue, [arg1, arg2, ...])
Function.prototype.bind()
bind方法用于将函数体内的this绑定到某个对象,然后返回一个新函数
var d = new Date();
d.getTime() // 1481869925657
var print = d.getTime;
print() // Uncaught TypeError: this is not a Date object.
//bind解决这个问题
var print = d.getTime.bind(d);
print()
var counter = {
count: 0,
inc: function () {
this.count++;
}
};
var obj = {
count: 100
};
var func = counter.inc.bind(obj);
func();
obj.count // 101
让counter的inc方法在obj环境中运行,并且返回这个函数让func指向这个函数,func执行就是在obj中执行,所以func执行之后ob。count为101。(上面代码中,bind方法将inc方法内部的this,绑定到obj对象。结果调用func函数以后,递增的就是obj内部的count属性)
网友评论