这道题,考察的是修改this指向,延申到call,apply和bind的作用和区别。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
/* 填写样式 */
</style>
</head>
<body>
<!-- 填写标签 -->
<script type="text/javascript">
// 填写JavaScript
function bindThis(f, oTarget) {
//题目要求我们封装函数f,所以返回的是一个function,封装后的f
return function(){
//函数的call方法指定函数内部this的指向
return f.call(oTarget,...arguments)
//也可以使用apply,如下
//return f.apply(oTarget,arguments)
}
//或者使用bind(bind函数返回的就是一个function),直接绑定this指向
//return f.bind(oTarget)
}
</script>
</body>
</html>
使用call,apply和bind都可以通过这道题。
1.使用call:
call是函数改变this指向的一个方法,题目要求我们封装函数f,所以返回的是一个function,封装后的f,所以在方法中要返回一个function
function bindThis(f, oTarget) {
return function(){
return f.call(oTarget,...arguments)
}
}
(注意这里的参数调用方法)
2.使用apply?
同理,和call的区别是参数调用是传入一个数组,参数调用方法不一样。
function bindThis(f, oTarget) {
return function(){
return f.apply(oTarget,arguments)
}
}
(注意这里的参数调用方法)
3.使用bind
函数的bind方法返回的是一个function,所以直接返回bind结果即可。
function bindThis(f, oTarget) {
//使用bind(bind函数返回的就是一个function),直接绑定this指向
return f.bind(oTarget)
}
这里多说一句,总结一下考察点: call,apply和bind的作用和区别
call、apply和bind都是JavaScript中Function对象的原型方法,它们的主要作用是改变函数的执行call、apply和bind都是JavaScript中Function对象的原型方法,它们的主要作用是改变函数的执行上下文,即修改函数运行时的this指向。
三者之间的主要区别体现在以下几个方面:
1. 传参方式不同:call和bind采用的是列表传参,而apply则可以接受数组或伪数组作为参数。
2. 执行机制有所区别:call和apply是一次性传入参数并立即执行,而bind则是返回绑定了特定this之后的函数,可以在以后的某个时间点进行调用。
3. 应用场景不同:例如,当我们需要在一个对象的方法中使用另一个对象的属性时,就可以利用call、apply或bind来改变方法内部的this指向。
应用场景不同,这里我们用一个例子来辅助理解。
假设我们有一个Person对象和一个sayHello方法,我们希望在调用sayHello方法时,能够将当前对象作为this传入到方法中。
function Person(name) {
? this.name = name;
}
Person.prototype.sayHello = function() {
? console.log('Hello, my name is ' + this.name);
};
现在,我们想要在一个名为john的Person对象上调用sayHello方法,并将当前对象作为this传入到方法中。我们可以使用call、apply或bind来实现这个需求。
1. 使用call:
var john = new Person('John');
john.sayHello.call(john); // 输出:Hello, my name is John
2. 使用apply:
var john = new Person('John');
john.sayHello.apply(john); // 输出:Hello, my name is John
3. 使用bind:
var john = new Person('John');
var boundSayHello = john.sayHello.bind(john);
boundSayHello(); // 输出:Hello, my name is John
在这个例子中,我们可以看到,无论是使用call、apply还是bind,都可以实现将当前对象作为this传入到方法中的目的。
但是,它们的应用场景略有不同:
- call和apply通常用于需要立即执行函数的场景,而bind则通常用于需要将函数绑定到某个对象上,并在以后的某个时间点进行调用的场景。