理解fn1.call.call(fn2);

摘要:call 方法是Function.prototype原型上天生自带的方法,所有的函数都可以调用的。它改变了call方法(Function.prototype原型上的call)的this指向。

描述

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);这个蒙圈了。


理解

有些绕,需要多念叨念叨琢磨琢磨。


call 方法是Function.prototype原型上天生自带的方法,所有的函数都可以调用的。


我觉得 call方法本身没有具体return什么出来,所以是undefined。

Function.prototype.call=function call(context){
    // [native code]
    // call方法的功能
    // 1. 把指定函数中的this指向context
    // 2. 把指定函数执行
    
    // 那么call方法中的this,即为指定函数。也就是说
    // 1. 把this中 的 this关键字指向context;
    // 2. 把指定函数执行this();
};


fn1.call(fn2);

按照上面的理解

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

所以调用的是 fn1 ,此时fn1中的 this 指向的是 fn2。
但是这个方法里面并没有使用this,而是直接输出了1。


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。


来自:https://segmentfault.com/a/1190000019654594


本文内容仅供个人学习、研究或参考使用,不构成任何形式的决策建议、专业指导或法律依据。未经授权,禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载,请保留原文来源信息,不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持!

链接: https://shenqiku.cn/article/FLY_3997