问答
1. apply、call 有什么作用,什么区别
Javascript的每个Function对象中有一个apply方法:
function.apply([thisObj[,argArray]])
还有一个类似功能的call方法:
function.call([thisObj[,arg1[, arg2[, [,.argN]]]]])
它们各自的定义:
apply:应用某一对象的一个方法,用另一个对象替换当前对象。
call:调用一个对象的一个方法,以另一个对象替换当前对象。它们的共同之处:
都“可以用来代替另一个对象调用一个方法,将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。它们的不同之处:
apply:
最多只能有两个参数——新this对象和一个数组 argArray。如果给该方法传递多个参数,则把参数都写进这个数组里面,当然,即使只有一个参数,也要写进数组里面。如果 argArray 不是一个有效的数组或者不是 arguments 对象,那么将导致一个 TypeError。如果没有提供 argArray 和 thisObj 任何一个参数,那么 Global 对象将被用作 thisObj,并且无法被传递任何参数。
call:
则是直接的参数列表,主要用在js对象各方法互相调用的时候,使当前this实例指针保持一致,或在特殊情况下需要改变this指针。如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj。
更简单地说,apply和call功能一样,只是传入的参数列表形式不同:如 func.call(func1,var1,var2,var3) 对应的apply写法为:func.apply(func1,[var1,var2,var3])
也就是说:call调用的为单个,apply调用的参数为数组
function sum(a,b){
console.log(this === window);//true
console.log(a + b);
}
sum(1,2);
sum.call(null,1,2);
sum.apply(null,[1,2]);
作用
- 调用函数
var info = 'tom';
function foo(){
//this指向window
var info = 'jerry';
console.log(this.info); //tom
console.log(this===window) //true
}
foo();
foo.call();
foo.apply();
- call和apply可以改变函数中this的指向
var obj = {
info:'spike'
}
foo.call(obj); //这里foo函数里面的this就指向了obj
foo.apply(obj);
- 借用别的对象的方法
eg:求数组中的最大值
var arr = [123,34,5,23,3434,23];
//方法一
var arr1 = arr.sort(function(a,b){
return b-a;
});
console.log(arr1[0]);
//方法二
var max = Math.max.apply(null,arr) //借用别的对象的方法
console.log(max);
代码
1. 以下代码输出什么?
var john = {
firstName: "John"
}
function func() {
alert(this.firstName + ": hi!")
}
john.sayHi = func
john.sayHi() // John: hi!,this指向调用sayHi()的john对象
2. 下面代码输出什么,为什么
func()
function func() {
alert(this) //window,因为在函数被直接调用时this绑定到全局对象。在浏览器中,window 就是该全局对象
}
3. 下面代码输出什么
function fn0(){
function fn(){
console.log(this);
}
fn();
}
fn0(); //window. 函数嵌套产生的内部函数的this不是其父函数,仍然是全局变量
document.addEventListener('click', function(e){
console.log(this); //#document.
//在事件处理程序中this代表事件源DOM对象
setTimeout(function(){
console.log(this); //window.
//setTimeout、setInterval这两个方法执行的函数this也是全局对象
}, 200);
}, false);
4. 下面代码输出什么,why
var john = {
firstName: "John"
}
function func() {
alert( this.firstName )
}
func.call(john) //John
//call(john)传入了john这个执行上下文,this指向john这个对象
5. 代码输出?
var john = {
firstName: "John",
surname: "Smith"
}
function func(a, b) {
alert( this[a] + ' ' + this[b] )
}
func.call(john, 'firstName', 'surname') //John Smith
//this指向john这个对象
6. 以下代码有什么问题,如何修改
var module= {
bind: function(){
$btn.on('click', function(){
console.log(this) //this指$btn
this.showMsg();
})
},
showMsg: function(){
console.log('饥人谷');
}
}
//修改后:
var module= {
bind: function(){
var cur = this; //将this代表的module存到cur
$btn.on('click', function(){
console.log(this) //$btn
cur.showMsg(); //饥人谷
})
},
showMsg: function(){
console.log('饥人谷');
}
}
7. 下面代码输出什么
var length = 3;
function fa() {
console.log(this.length);
}
var obj = {
length: 2,
doSome: function (fn) {
console.log(this)// obj
fn(); //3. 函数嵌套的内部函数this指向全局变量
arguments[0](); //1. arguments对象在调用fa,所以this指arguments对象。长度为1
}
}
obj.doSome(fa)
8. 下面代码输出什么? why
obj = {
go: function() { alert(this) }
}
obj.go(); //obj. go是obj身上的一个方法,就算放在全局环境下,this依旧指向obj;
(obj.go)(); //obj. 这是一个自执行函数, 依旧是obj去调用了这个方法;
(a = obj.go)(); //window
//将函数赋值给一个全局变量a;这个时候a()执行的话,就变成了依赖的是全局环境,所以this指向了window;
(0 || obj.go)(); //window
//相当于 (temp = 0 || obj.go)(),即相当于上一条例子