今天被人问到js中的call,apply的区别和用途,解释了一番后,想到之前在逼乎上看到一位小伙伴生动形象的解释

本身不难理解,看下MDN就知道了,但是不常用,遇到了,还要脑回路回转下。或者时间长了,还是要确定下去看下文档,为了方便记忆:

猫吃鱼,狗吃肉,奥特曼打小怪兽。

有天狗想吃鱼了

猫.吃鱼.call(狗,鱼)

狗就吃到鱼了

猫成精了,想打怪兽

奥特曼.打小怪兽.call(猫,小怪兽)

或者 马云.赚钱.call(我)

还有一位杨志大佬解释的更清楚

我们要先明白存在call和apply的原因,才能记得牢一点:
在javascript OOP中,我们经常会这样定义:
 
function cat(){
}
cat.prototype={
food:"fish",
say: function(){
alert("I love "+this.food);
}
} var blackCat = new cat;
blackCat.say();

但是如果我们有一个对象 whiteDog = {food:"bone"}, 我们不想对它重新定义say方法,

那么我们可以通过call或apply用blackCat的say方法:blackCat.say.call(whiteDog);

所以,可以看出call和apply是为了动态改变this而出现的,当一个object没有某个方法,但是其他的有,我们可以借助call或apply用其它对象的方法来操作。

用的比较多的,通过document.getElementsByTagName选择的dom 节点是一种类似array的array。

它不能应用Array下的push,pop等方法。我们可以通过:

var domNodes = Array.prototype.slice.call(document.getElementsByTagName("*"));

这样domNodes就可以应用Array下的所有方法了。

其他的就不提了,讲多了反而迷惑。

 

call 和apply的用法都是一样的,知识传参不同,apply是数组,call是参数

就这样记住了。

快速理解js中的call,apply的作用的更多相关文章

  1. js中call和apply的作用和用法

    call和apply的用途是完全一样的.改变函数中this的指向: 为什么要改变this的指向呢?这个有什么用?有哪些场景呢? 首先this的指向总是在变的,this的指向是由函数执行时所在的环境决定 ...

  2. 彻底理解js中this的指向,不必硬背。

    首先必须要说的是,this的指向在函数定义的时候是确定不了的,只有函数执行的时候才能确定this到底指向谁,实际上this的最终指向的是那个调用它的对象(这句话有些问题,后面会解释为什么会有问题,虽然 ...

  3. 图文结合深入理解 JS 中的 this 值

    图文结合深入理解 JS 中的 this 值 在 JS 中最常见的莫过于函数了,在函数(方法)中 this 的出现频率特别高,那么 this 到底是什么呢,今天就和大家一起学习总结一下 JS 中的 th ...

  4. 如何理解js中的this和实际应用中需要避开哪些坑

    this是什么 this就是函数内部的关键字 看下面例子理解js中的this // 例子1 function fnOne () { console.log(this) } 'use strict' f ...

  5. 深入理解JS中的对象(二):new 的工作原理

    目录 序言 不同返回值的构造函数 深入 new 调用函数原理 总结 参考 1.序言 在 深入理解JS中的对象(一):原型.原型链和构造函数 中,我们分析了JS中是否一切皆对象以及对象的原型.原型链和构 ...

  6. 深入理解JS中的对象(三):class 的工作原理

    目录 序言 class 是一个特殊的函数 class 的工作原理 class 继承的原型链关系 参考 1.序言 ECMAScript 2015(ES6) 中引入的 JavaScript 类实质上是 J ...

  7. 深入理解Js中的this

    深入理解Js中的this JavaScript作用域为静态作用域static scope,但是在Js中的this却是一个例外,this的指向问题就类似于动态作用域,其并不关心函数和作用域是如何声明以及 ...

  8. 怎么理解js中的事件委托

    怎么理解js中的事件委托 时间 2015-01-15 00:59:59  SegmentFault 原文  http://segmentfault.com/blog/sunchengli/119000 ...

  9. 如何更好的理解js中的this,分享2段有意思的代码

    关于js中this的浅析,大家可以点击[彻底理解js中this的指向,不必硬背]这篇博客了解. 今天遇到2段比较有意思的代码. ----------------第一段----------------- ...

随机推荐

  1. Ubuntu16.04安装Qt5.12.2

    第一步:下载文件 https://download.qt.io/official_releases/qt/5.12/5.12.2/ 第二步:安装依赖库 sudo apt-get install bui ...

  2. 验证码的设计与记住我存储用户名密码cookie的技术及单选按钮选择登录人身份的实现

    login.jsp页面 <head> <script type="text/javascript" src="js/captcha.js"&g ...

  3. 关于Android中ION的libion

    在高通的OpenCL SDK中,其Android.mk文件中,有判断当前kernel的版本,如果大于4.12,那么就使用libion.so,否则则使用ion kernle uapi: # Tries ...

  4. go get获取gitlab私有仓库的代码

    目录 目录 1.Gitlab的搭建 2.如何通过go get,获取Gitlab的代码 目录 1.Gitlab的搭建   在上一篇文章中,已经介绍了如何搭建Gitlab Https服务<Nginx ...

  5. vue watch监听验证码时,axios延迟发送post请求。

    标题写的全面一些,方便其他人检索,我就是找了半天找不到资料,最后自己搞定了. 原理: 每次监听到输入值变化,就打一个时间戳,然后暂停2秒再去提交post验证. 但是每次提交前,判断一下之前打的时间戳和 ...

  6. ClickOnce一项Winform部署

    先建一个Winform 控制台程序 建好后从工具箱里拖出来个 文本框 在属性中把TEXT改了 鼠标放到项目上点击右键——>属性 如下图所示,有两个发布位置. 发布位置可以选择本地文件夹,也可以选 ...

  7. FelxCell常用属性设置(未完待续......)

    this.grid1.AllowUserPaste//返回或设置是否允许用户粘贴文字和格式 grid1.Cell(Rows, 1).WrapText = true;//设置单元格自动换行

  8. keil 中报错和警告提示解决办法

    1.warning: #1-D: last line of file ends without a newline 解决办法:在文件最后一行加入一个回车. 2.error: #134: expecte ...

  9. AI和机器学习对云应用的安全产生了何种影响?

    AI和机器学习对云应用的安全产生了何种影响? 正如其他许多新兴技术一样,AI是一把双刃剑,它对于云计算的安全影响是双重的:这项技术可以使工作负载变得更加安全,但也可能会为新的威胁打开大门. 出现这种分 ...

  10. django.core.exceptions.ImproperlyConfigured: Error loading MySQLdb module: No module named 'MySQLdb'. Did you install mysqlclient or MySQL-python?

    Error msg: Unhandled exception in thread started by <function check_errors.<locals>.wrapper ...