首先说下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

call的初步理解的更多相关文章

  1. javascript 原型及原型链的初步理解

    最近折腾了好久,终于是把js里面的原型和原型链做了个初步的理解: 在这里,我打个比喻: 我(child),我妈constructor(构造函数)生了我:别人问我老妈跟谁生的我,于是此时我妈会指向我爸爸 ...

  2. Spring学习笔记--环境搭建和初步理解IOC

    Spring框架是一个轻量级的框架,不依赖容器就能够运行,像重量级的框架EJB框架就必须运行在JBoss等支持EJB的容器中,核心思想是IOC,AOP,Spring能够协同Struts,hiberna ...

  3. Graph Cuts初步理解

    一些知识点的初步理解_8(Graph Cuts,ing...) Graph cuts是一种十分有用和流行的能量优化算法,在计算机视觉领域普遍应用于前背景分割(Image segmentation).立 ...

  4. 非常易于理解‘类'与'对象’ 间 属性 引用关系,暨《Python 中的引用和类属性的初步理解》读后感

    关键字:名称,名称空间,引用,指针,指针类型的指针(即指向指针的指针) 我读完后的理解总结: 1. 我们知道,python中的变量的赋值操作,变量其实就是一个名称name,赋值就是将name引用到一个 ...

  5. springBoot(1)---springboot初步理解

    springboot初步理解 在没有用SpringBoot之前,我们用spring和springMVC框架,但是你要做很多比如: (1)配置web.xml,加载spring和spring mvc 2) ...

  6. Mysql加锁过程详解(7)-初步理解MySQL的gap锁

    Mysql加锁过程详解(1)-基本知识 Mysql加锁过程详解(2)-关于mysql 幻读理解 Mysql加锁过程详解(3)-关于mysql 幻读理解 Mysql加锁过程详解(4)-select fo ...

  7. 关于THINKPHP5模型关联的初步理解

    初步理解的意思是,使用最常用的关联模型,然后可以正常运行 还是打个比方 文章表  和文章分类表 一个文章分类可以有多个文章  所以  文章分类模型和文章建立 hasMany的关联 而文章和文章分类表则 ...

  8. spfa+差分约束系统(C - House Man HDU - 3440 )+对差分约束系统的初步理解

    题目链接:https://cn.vjudge.net/contest/276233#problem/C 题目大意:有n层楼,给你每个楼的高度,和这个人单次的最大跳跃距离m,两个楼之间的距离最小是1,但 ...

  9. Android-自定义控件-继承View与ViewGroup的初步理解

    继承View需要走的流程是: 1.构造实例化, public ChildView(Context context, @Nullable AttributeSet attrs) 2.测量自身的高和宽on ...

  10. 初步理解IOC和DI和AOP模式

    初步理解IOC和DI和AOP模式 控制反转(IOC) 控制反转(IOC,Inversion of Control)是一种转主动为被动关系的一种编程模式,有点类似于工厂模式,举个栗子, 下面这个这不是I ...

随机推荐

  1. git使用之如何将github库下载到本地与如何将代码上传github

    git使用之如何将github库下载到本地与如何将代码上传github ---------------------------------------------------------------- ...

  2. The Wall (medium)

    The Wall (medium) Heidi the Cow is aghast: cracks in the northern Wall? Zombies gathering outside, f ...

  3. (转)C++中返回对象的情形及RVO

    http://www.cnblogs.com/xkfz007/archive/2012/07/21/2602110.html 之前有文章介绍过临时对象和返回值优化RVO方面的问题.见此处. 在C++中 ...

  4. js 复制内容到剪切板

    function oCopy(objname){//只兼容IE var obj = $(objname); obj.select(); js=obj.createTextRange(); js.exe ...

  5. nodejs 教程

    http://www.runoob.com/nodejs/nodejs-http-server.html

  6. libthread_db

    http://timetobleed.com/notes-about-an-odd-esoteric-yet-incredibly-useful-library-libthread_db/

  7. cocos2dx 3.2 的中国象棋游戏

    改编来源:http://cn.cocos2d-x.org/tutorial/lists?id=103 在cocos2dx官网看到了这么个教程,是cocos2dx 2.x版本的,于是用 cocos2dx ...

  8. 第三方app抽奖发送微信红包

    1.控制器方法: private string SendRedPackge(string OpenId, int Amount, string LuckyCode) { Models.PayWeiXi ...

  9. javascript模拟鼠标双击事件

    通常我们在做开发的时候需要通过单击切换对立事件,简单做了一个模型. <!DOCTYPE html> <html> <head> <title>javas ...

  10. Lucene学习注意要点

    相关书籍: <Lucene实战>第二版: <搜索引擎基础教程>: <Lucene搜索引擎开发进阶实战>:(我现在看得书) 学习注意要点: 不要盲目从代码入手,而要先 ...