apply()与call()的区别

一直都没太明白apply()与call()的具体使用原理,今日闲来无事,决定好好研究一番。

JavaScript中的每一个Function对象都有一个apply()方法和一个call()方法,它们的语法分别为:

/*apply()方法*/
function.apply(thisObj[, argArray])/*call()方法*/
function.call(thisObj[, arg1[, arg2[, [,...argN]]]]);

它们各自的定义:

apply:调用一个对象的一个方法,用另一个对象替换当前对象。例如:B.apply(A, arguments);即A对象应用B对象的方法。

call:调用一个对象的一个方法,用另一个对象替换当前对象。例如:B.call(A, args1,args2);即A对象调用B对象的方法。

它们的共同之处:

都“可以用来代替另一个对象调用一个方法,将一个函数的对象上下文从初始的上下文改变为由thisObj指定的新对象”。

它们的不同之处:

apply:最多只能有两个参数——新this对象和一个数组argArray。如果给该方法传递多个参数,则把参数都写进这个数组里面,当然,即使只有一个参数,也要写进数组里。如果argArray不是一个有效的数组或arguments对象,那么将导致一个TypeError。如果没有提供argArray和thisObj任何一个参数,那么Global对象将被用作thisObj,并且无法被传递任何参数。

call:它可以接受多个参数,第一个参数与apply一样,后面则是一串参数列表。这个方法主要用在js对象各方法相互调用的时候,使当前this实例指针保持一致,或者在特殊情况下需要改变this指针。如果没有提供thisObj参数,那么 Global 对象被用作thisObj。 

实际上,apply和call的功能是一样的,只是传入的参数列表形式不同。

示例代码:

(1)基本用法

复制代码
function add(a,b){return a+b;  
}
function sub(a,b){return a-b;  
}
var a1 = add.apply(sub,[4,2]);  //sub调用add的方法
var a2 = sub.apply(add,[4,2]);
alert(a1);  //6     
alert(a2);  //2

/*call的用法*/
var a1 = add.call(sub,4,2);
复制代码

(2)实现继承

复制代码
function Animal(name){this.name = name;this.showName = function(){alert(this.name);    }    
}function Cat(name){Animal.apply(this,[name]);    
}var cat = new Cat("咕咕");
cat.showName();/*call的用法*/
Animal.call(this,name);
复制代码

 (3)多重继承

复制代码
function Class10(){this.showSub = function(a,b){alert(a - b);}   
}function Class11(){this.showAdd = function(a,b){alert(a + b);}  
}function Class12(){Class10.apply(this);Class11.apply(this);   // Class10.call(this);//Class11.call(this);  
}var c2 = new Class12();
c2.showSub(3,1);    //2
c2.showAdd(3,1);    //4
复制代码

 

apply的一些其他巧妙用法

(1)Math.max 可以实现得到数组中最大的一项:

因为Math.max不支持Math.max([param1,param2])也就是数组,但是它支持Math.max(param1,param2...),所以可以根据apply的特点来解决 var max=Math.max.apply(null,array),这样就轻易的可以得到一个数组中的最大项(apply会将一个数组转换为一个参数接一个参

数的方式传递给方法)

这块在调用的时候第一个参数给了null,这是因为没有对象去调用这个方法,我只需要用这个方法帮我运算,得到返回的结果就行,所以直接传递了一个null过去。

用这种方法也可以实现得到数组中的最小项:Math.min.apply(null,array)

(2)Array.prototype.push可以实现两个数组的合并

同样push方法没有提供push一个数组,但是它提供了push(param1,param2...paramN),同样也可以用apply来转换一下这个数组,即:

var arr1=new Array("1","2","3");
var arr2=new Array("4","5","6");
Array.prototype.push.apply(arr1,arr2);    //得到合并后数组的长度,因为push就是返回一个数组的长度

也可以这样理解,arr1调用了push方法,参数是通过apply将数组转换为参数列表的集合

通常在什么情况下,可以使用apply类似Math.max等之类的特殊用法:

一般在目标函数只需要n个参数列表,而不接收一个数组的形式,可以通过apply的方式巧妙地解决这个问题。

转载于:https://www.cnblogs.com/snowhite/p/9225115.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/538403.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

java代码执行了两次_Java中JComboBox的itemStateChanged事件执行两次的解释

今天做项目,用到了JComboBox,即下拉列表框。为了在被选中的项发生改变时获得被选中的项,所以使用的ItemStateChanged事件,可是问题就来了,每次触发该事件,它都执行两次,屡试不爽。一开始以为是代…

python连接mongo_使用简单的Python连接访问MongoDB

继续来聊MongoDB。MongoDB作为了一个数据库产品软件,除了服务器Server端进程(mongod)外,还提供了比较丰富的访问连接接口。我们最常用的就是两个类型,一个是原生mongo shell,另一个就是应用程序语言访问接口。1、从Mongo Shell到应…

spring与mybatis三种整合方法

原文链接:http://www.cnblogs.com/wangmingshun/p/5674633.html ------------------------------------------------------------------------------------------------- 1、采用MapperScannerConfigurer,它将会查找类路径下的映射器并自动将它们创建成…

js常用的2中排序方法:冒泡排序和快速排序

冒泡排序:例如9 4 5 6 8 3 2 7 10 1 首先:9和4比较 4放前 4 9 5 6 8 3 2 7 10 1 4和5比较 4不动 4 9 5 6 8 3 2 7 10 1 4和6比较 4不动 4 9 5 6 8 3 2 7 10 1 4和3比较 3放前 3 9 5 6 8 4 2 7 10 1 3和2比较 2放前 2 9 5 6 8…

java 注册页面正则式_Java使用正则表达式对注册页面进行验证功能实现

本文给大家介绍java使用正则表达式对注册页面进行验证的代码,代码如下所示:package regex;import java.util.Scanner;import java.util.regex.Matcher;import java.util.regex.Pattern;public class registered {public static void main(String[] args)…

python 编程效率_如何有效提升数据分析效率?五大Python技巧

如何有效提升数据分析效率?相信这是所有数据分析工作者都想解决的问题。本文整理了五大python技巧,分别是Pandas Profiling;使用 Cufflinks 和 Plotly 绘制 Pandas 数据;IPython 魔术命令;Jupyter 中的格式编排&#x…

please select a vaild python interpret

当 JetBrains PyCharm 2017.1.3 x64 遇到 please select a vaild python interpret 错误时: 进入PyCharm setting 选项,搜索 interpret

Grafana分析Nginx日志

配置Groub by -Terms时报错,提示需要设置fielddatatrue,报错内容大概如下: "Fielddata is disabled on text fields by default ... " 解决方法如下: https://www.elastic.co/guide/en/elasticsearch/reference/curren…

php curl json post请求_php post请求发送json对象数据参数

网页中发送请求时,大部分情况都参数以键值组合发送数据的,而一些第三方如java开发的接口中需要发送post请求,请求参数为json类型。既然要发送json数据,首页我们需要在请求头中定义数据类型为json,告诉服务器客服端发送…

python删除链表中的最小元素_LintCode Python 入门级题目 删除链表元素、整数列表排序...

删除链表元素:循环列表head,判断当前指针pre.next的val是否等于val,如果是,当前pre重指向pre.next.next,直至pre.next Null# Definition for singly-linked list.# class ListNode:# def __init__(self, x):# self.va…

IDEA 更换主题

1、下载主题文件 百度或者谷歌 IDEA themes 网址有可能会变化。目前是 http://color-themes.com 选择自己喜欢的颜色,下载。 2、导入主题文件 File----Import Setting 导入下载的jar文件,一路确认,idea会自动重启。 3、选择主题 点击…

【CentOS 7笔记】cp、mv、文档查看方式

2019独角兽企业重金招聘Python工程师标准>>> 一. copy 常用cp -r/R #拷贝目录,递归 cp -i #覆盖时会提示,默认项 cp -p #保留源目录或源文件的属性 cp -b #源文目与目的文目建立链接,链接 cp -f #强制覆盖 cp -v …

php 情书,php趣味编程 - php输出笛卡尔情书的秘密

/*笛卡尔情书的秘密心形图案的实现。重点是心形函数ra(1-sin),据说这是笛卡尔死前寄出的最后一封情书内容。这里面隐藏着一个刻骨铭心的秘密;“一生只为等待能手绘这个函数给我的人”*/$width 500;$height 500;header("Content-type: image/gif");$img …

python 月报_python实践--月报分析之获取jira缺陷数据

首先安装jira,同其他第三方库,直接可以 easy_install jira。判断jira是否按转成功输入:from jira import JIRA,如果没有报错则说明安装成功;#连接jirajira JIRA(“http://jira地址”,basic_auth (“用户名…

JAVA中的native

native主要用于方法上,简单介绍如下: 1、一个native方法就是一个Java调用非Java代码的接口。一个native方法是指该方法的实现由非Java语言实现,比如用C或C实现。 2、在定义一个native方法时,并不提供实现体(比较像定…

script filename php,PHP $_SERVER['SCRIPT_FILENAME'] 与 __FILE__ 的区别

PHP $_SERVER[SCRIPT_FILENAME] 与 __FILE__通常情况下,PHP $_SERVER[SCRIPT_FILENAME] 与 __FILE__ 都会返回 PHP 文件的完整路径(绝对路径)与文件名:echo SCRIPT_FILENAME 为:,$_SERVER[SCRIPT_FILENAME];echo ;echo __FILE__ 为&#xff1…

015. 深入JVM学习—Java引用类型

2019独角兽企业重金招聘Python工程师标准>>> 1. 引用类型划分 强引用:当内存不足时,JVM宁可出现“OutOfMemoryError”错误停止,也需要进行保存,并且不会将此空间回收。 软引用:当内存不足的时候&#xff0…

python人脸关键点识别_用Face++实现人脸关键点检测

最近看了一篇很有意思的文章 http://matthewearl.github.io/2015/07/28/switching-eds-with-python/ ,本来想自己复现一下,后来发现自己太菜,用了一整天只完成了不到一半,最近要找工作了,看书看的有点烦,本…

【东营seo】SEO发展下的大机遇

【东营seo】SEO发展下的大机遇 seo优化越来越难做,很多的人都开始怀疑seo优化没有价值。的确现如今seo优化与十年前比确实不是一个级别的,即便如此,seo优化还是存在其持续发展的机制。  自然搜索排名不再是唯一的竞争点,语音搜索…

手机整屏显示数据php,完美解决手机网页大背景不能铺完整个屏幕的超级代码

html,body{min-height:100%;} 优化 html{min-height:100%;} html,body{min-height:100%;}body{background-image:url(bg_640.jpg);background-size:cover;babackground-repeat:no-repeat;}.main{padding-top:141%;text-align:cenhtml,body{min-height:100%;}优化html{min-heigh…