apply、call 有什么作用,什么区别
call
和 apply
是为了动态改变 this
⽽出现的,当⼀个 object 没有某个⽅法,但是其他的有,就可以借助 call
或 apply
⽤其它对象的⽅法来操作。
对于 apply
、call
⼆者⽽⾔,作⽤完全⼀样,只是接受参数的⽅式不太⼀样。
call
直接传入参数;apply
传入参数数组。
fn.call(context, param1, param2)
fn.apply(context, [param1, param2])
1. 以下代码输出什么?
var john = {
firstName: "John"
}
function func() {
alert(this.firstName + ": hi!")
}
john.sayHi = func
john.sayHi() // John: hi! (this : john)
2. 下面代码输出什么?为什么?
func() // window,因为是在 window 下调用函数
function func() {
alert(this)
}
3. 下面代码输出什么?
function fn0(){
function fn(){
console.log(this);
}
fn();
}
fn0(); // window
document.addEventListener('click', function(e){
console.log(this); // document,事件绑定,this 为 document
setTimeout(function(){
console.log(this); // window
}, 200);
}, false);
4. 下面代码输出什么?为什么?
var john = {
firstName: "John"
}
function func() {
alert( this.firstName )
}
func.call(john) // John , func.call(context)
5. 代码输出?
var john = {
firstName: "John",
surname: "Smith"
}
function func(a, b) {
alert( this[a] + ' ' + this[b] )
}
func.call(john, 'firstName', 'surname') // John Smith
6. 以下代码有什么问题,如何修改?
var module= {
bind: function(){
var that = this; // 先将 this 保存下来
$btn.on('click', function(){
console.log(this) // this 指 $btn
that.showMsg();
})
},
showMsg: function(){
console.log('饥人谷');
}
}