fn1.call.call(fn2);

描述

function fn1(){
    console.log(1);
}
function fn2(){
    console.log(2);
}
fn1.call(fn2); // 輸出1
fn1.call.call(fn2); // 輸出2

問題

看到這個題目,第一反應是蒙圈的。函數

fn1.call(fn2); 這個是理解的。
fn1.call.call(fn2);這個蒙圈了。this

理解

有些繞,須要多唸叨唸叨琢磨琢磨。spa

clipboard.png

call 方法是Function.prototype原型上天生自帶的方法,全部的函數均可以調用的。prototype

clipboard.png

我以爲 call方法自己沒有具體return什麼出來,因此是undefinedcode

Function.prototype.call=function call(context){
    // [native code]
    // call方法的功能
    // 1. 把指定函數中的this指向context
    // 2. 把指定函數執行
    
    // 那麼call方法中的this,即爲指定函數。也就是說
    // 1. 把this中 的 this關鍵字指向context;
    // 2. 把指定函數執行this();
};

fn1.call(fn2);

按照上面的理解blog

  1. call 方法中的this是fn1
  2. 把call方法中的this(fn1)中的this指向fn2
  3. 調用 call方法中的this

因此調用的是 fn1 ,此時fn1中的 this 指向的是 fn2。
可是這個方法裏面並無使用this,而是直接輸出了1。ip

fn1.call.call(fn2);

按照上面的理解原型

  1. call 方法中的 this 是 fn1.call【全部函數均可以調用call,調用的是原型上call方法】
  2. 把call方法中的this (fn1.call) 中的this 指向fn2
  3. 調用call方法中的this

因此調用的是 fn2(這裏有些繞,多唸叨唸叨琢磨琢磨),此時fn1.call中的this指向的是fn2。
它改變了call方法(Function.prototype原型上的call)的this指向。
此處調用了call方法中的this,即調用了fn2,輸出了2。it

交流

我在這裏與你一同成長~

相關文章
相關標籤/搜索