首先说下call的本质是一个函数
模仿
Function.prototype.call = function(context){
// this表示某函数,函数里面的this先被替换成context,然后再执行
this.bind(context)();
}
然后理解这个
Function.prototype.call.call(context);
// 相当于
this.bind(context)();
// this指Function.prototype.call,于是相当于
Function.prototype.call.bind(context)();
// 因为Function.prototype.call这个函数里面的this变成了context
context.bind(context)();
然后再理解理解这个
Function.prototype.call.call.call(context);
// 相当于
this.bind(context)();// this指Function.prototype.call.call,因为call本身就是函数,而任何函数的call属性相当于Function.prototype.call,也就是Function.prototype.call.call = Function.prototype.call,然后this实际还是指Function.prototype.call,重复上面的说
Function.prototype.call.bind(context)(); // 因为Function.prototype.call这个函数里面的this变成了context context.bind(context)();
然后,看一个demo:
function fn1(){
console.log(1)
}
function fn2(){
console.log(2)
}
// Function.prototype.call(fn2);this指当前的实例fn1,fn1里面的this是fn2
fn1.call(fn2);
// Function.prototype.call.call(fn2);this指Function.prototype.call,Function.prototype.call里面的this是fn2
fn1.call.call(fn2);
// 相当于
fn2();
//其实只要超过一个call,都是fn2()
所以call函数执行,主要看call函数里面的this指哪个函数,这个函数自己里面的this换成指定context,然后执行
说另外一个好玩的,call可以改变函数的this的值,但在非严格模式下,fn.call(),fn.call(null),fn.call(undefined),这些写法将this的值指向window,严格模式下,指啥是啥
var obj = {
fn:function(){
console.log(this)
}
}
var n = {
name:"hua"
}
obj.fn.call(null); // window
obj.fn(); // obj