解释一

作者:杨志

链接:https://www.zhihu.com/question/20289071/answer/14644278

来源:知乎

著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

要先明白存在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下的所有方法了。

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

解释二

作者:赵望野

链接:https://www.zhihu.com/question/20289071/answer/14745394

来源:知乎

著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

call 和 apply 都是为了改变某个函数运行时的 context 即上下文而存在的,换句话说,就是为了改变函数体内部 this 的指向。

因为 JavaScript 的函数存在「定义时上下文」和「运行时上下文」以及「上下文是可以改变的」这样的概念。

二者的作用完全一样,只是接受参数的方式不太一样。例如,有一个函数 func1 定义如下:

var func1 = function(arg1, arg2) {};

就可以通过 func1.call(this, arg1, arg2); 或者 func1.apply(this, [arg1, arg2]); 来调用。其中 this 是你想指定的上下文,他可以任何一个 JavaScript 对象(JavaScript 中一切皆对象),call 需要把参数按顺序传递进去,而 apply 则是把参数放在数组里。

JavaScript 中,某个函数的参数数量是不固定的,因此要说适用条件的话,当你的参数是明确知道数量时,用 call,而不确定的时候,用 apply,然后把参数 push 进数组传递进去。当参数数量不确定时,函数内部也可以通过 arguments 这个数组来便利所有的参数。

转自知乎,自个儿留着看,啧啧啧~~

炒鸡简单的javaScript的call和apply方法的更多相关文章

  1. 炒鸡简单的canvas粒子(山东数漫江湖)

    位图的canvas一直不会被svg比下去的原因了. 俗话说,须弥芥子,是大小之说,也有以小见大之说,颗颗粒子,足以构建宏大效果. 这是一篇炒鸡简单的canvas粒子教程,主要是讲如何粒子特效的原理,一 ...

  2. JavaScript之call()和apply()方法详解

    简介:apply()和call()都是属于Function.prototype的一个方法属性,它是JavaScript引擎内在实现的方法,因为属于Function.prototype,所以每个Func ...

  3. 关于javascript中call()和apply()方法的总结

    前段时间在使用javascript的过程中遇到了继承的问题,自己顺便就对call()和apply()方法进行了了解. 两个方法的共同之处:这两个方法作用相同,都用来改变当前函数调用的对象,即改变thi ...

  4. Effective JavaScript Item 21 使用apply方法调用函数以传入可变參数列表

    本系列作为Effective JavaScript的读书笔记. 以下是一个拥有可变參数列表的方法的典型样例: average(1, 2, 3); // 2 average(1); // 1 avera ...

  5. 关于JAVASCRIPT call 方法和 apply 方法性能对比

    JavaScript 关于call 方法和 apply 方法常用形式 call obj.call(object, args , ....); apply obj.apply(object, [args ...

  6. Redux系列02:一个炒鸡简单的react+redux例子

    前言 在<Redux系列01:从一个简单例子了解action.store.reducer>里面,我们已经对redux的核心概念做了必要的讲解.接下来,同样是通过一个简单的例子,来讲解如何将 ...

  7. 啊啊啊啊啊啊啊今天就写,炒鸡简单 数据库Sqlite的创建,库的增删改查

    啦啦啦啦啦啦啦 写这个不用多长时间,我直接写代码注释都是些语句,Sql语句和Api来操作数据库 ,语句的参数我会注释 SQLite数据库创建数据库需要使用的api:SQLiteOpenHelper必须 ...

  8. Python制作动态二维码只需要一行代码!炒鸡简单!

    分享一个比较有意思的项目,只需要一行Python代码就可以快捷方便生成普通二维码.艺术二维码(黑白/彩色)和动态GIF二维码. 用法比较简单,直接通过pip安装即可. pip3 install myq ...

  9. ES6中Fetch的封装及使用,炒鸡简单~

    之前写过一篇<ajax.axios.fetch之间的详细区别以及优缺点> 戳这里 1.封装 (http.js) class Ajax { get(url) { return new Pro ...

随机推荐

  1. 【转载】SSH login without password 免密登陆

    Your aim You want to use Linux and OpenSSH to automate your tasks. Therefore you need an automatic l ...

  2. windows网络模型之重叠IO(完成例程)的使用

    #include <WINSOCK2.H> #include <stdio.h> #define PORT 5150 #define MSGSIZE 1024 #pragma ...

  3. IOS开发之——IOS模拟器调试蓝牙BLE

    版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/zhenyu5211314/article/details/24399887 因为在iPhone 4s ...

  4. 2018.11.26 struts2流程源码

    struts2的架构图 从最上面的类开始,也就是i 我们的核心过滤器strutsPrepareAndExecuteFilter 判断当前请求是否由struts2来处理,如果是就往else走,不由它来处 ...

  5. php 的 number_format使用

    $num = 1.0258963147; // 1.0259 $num = number_format($num, 4, '.', ''); $num = number_format($num); $ ...

  6. ASP.NET整体运行机制+asp.net请求管道+页面生命周期+MVC整体运行机制原理图

    在网上找的,个人感觉很好的

  7. 【luogu P2234 [HNOI2002]营业额统计】 题解

    题目链接:https://www.luogu.org/problemnew/show/P2234 本来是一道打算练习splay的题目 发现暴力可以过啊.. #include <iostream& ...

  8. Do not mutate vuex store state outside mutation handlers.

    组件代码: selectItem(item,index) { this.selectPlay({ list: this.songs, index }) }, ...mapActions([ 'sele ...

  9. 如何使用 SSL 证书配置端口

    创建使用自承载的 Windows Communication Foundation (WCF) 服务时WSHttpBinding类,使用传输安全,还必须使用 X.509 证书配置端口. 如果不是在创建 ...

  10. c/c++ 表白小程序

    1.开发工具: vs  vc(任选一个) 2.准备材料 : a.一首音乐 (注意:音乐要求重命名为  “x”  ) b.20张图片(注意: 图片要求重命名为  “1”  "2"   ...