理解fn1.call.call(fn2);

更新日期: 2019-07-02阅读: 4k标签: call

描述

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://fly63.com/article/detial/3997

js的call() ,apply() 两种方法的区别和用法,最白话文的解释

call和apply可以用来重新定义函数的执行环境,也就是this的指向; call 和 apply 都是为了改变某个函数运行时的 context 即上下文而存在的 换句话说,就是为了改变函数体内部 this 的指向。

js中apply,call,bind区别

js中有三个改变this指针的方法,分别是 apply,call,bind。很多人只知道能改变的this,但是具体的适用场景不是太清楚。我也是遇到坑后不断的实践发现了区别。call ,apply方法:

Javascript之模拟实现call,apply

首先介绍下call和apply两个方法,这两个方法都是挂载在函数的原型上的,所以所有的函数都可以调用这两个方法。call()方法的作用和 apply() 方法类似,区别就是call()方法接受的是参数列表

call、apply、bind

call定义:调用一个对象的一个方法,以另一个对象替换当前对象,传递多个参数,apply定义:应用某一对象的一个方法,用另一个对象替换当前对象,apply传递多个参数的时候第二个参数需要传递一个数组

apply 和 call 的用法、区别

ECMAScript 规范给所有函数都定义了 call 与 apply 两个方法,它们的应用非常广泛,它们的作用也是一模一样,只是传参的形式有区别而已。

深入解析如何实现 call、apply 和 bind

这是 JS 原生方法原理探究系列的第一篇文章。本文会介绍如何实现 call、apply 和 bind 方法。关于这几个方法的具体用法,MDN 以及网上的文章已经描述得很清楚,这里不再赘述。

详解JS中 call 方法的实现

本文将全面的,详细解析call方法的实现原理,并手写出自己的call方法,相信看完本文的小伙伴都能从中有所收获。

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!