Js apply方法详解
我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这里我做如下笔记,希望和大家分享.. 如有什么不对的或者说法不明确的地方希望读者多多提一些意见,以便共同提高.. 主要我是要解决一下几个问题: 1.apply和call的区别在哪里 2.什么情况下用apply,什么情况下用call 3.apply的其他巧妙用法(一般在什么情况下可以使用apply) 我首先从网上查到关于apply和call的定义,然后用示例来解释这两个方法的意思和如何去用. apply:方法能劫持另外一个对象的方法,继承另外一个对象的属性. Function.apply(obj,args)方法能接收两个参数
obj:这个对象将代替Function类里this对象
args:这个是数组,它将作为参数传给Function(args-->arguments) call:和apply的意思一样,只不过是参数列表不一样. Function.call(obj,[param1[,param2[,…[,paramN]]]])
obj:这个对象将代替Function类里this对象
params:这个是一个参数列表 1.apply示例: <script type="text/javascript">
/*定义一个人类*/
function Person(name,age) {
this.name=name; this.age=age;
}
/*定义一个学生类*/
functionStudent(name,age,grade) {
Person.apply(this,arguments); this.grade=grade;
}
//创建一个学生类
var student=new Student("qian",21,"一年级");
//测试
alert("name:"+student.name+"\n"+"age:"+student.age+"\n"+"grade:"+student.grade);
//大家可以看到测试结果name:qian age:21 grade:一年级
//学生类里面我没有给name和age属性赋值啊,为什么又存在这两个属性的值呢,这个就是apply的神奇之处.
</script> 分析: Person.apply(this,arguments); this:在创建对象在这个时候代表的是student arguments:是一个数组,也就是[“qian”,”21”,”一年级”]; 也就是通俗一点讲就是:用student去执行Person这个类里面的内容,在Person这个类里面存在this.name等之类的语句,这样就将属性创建到了student对象里面 2.call示例 在Studen函数里面可以将apply中修改成如下: Person.call(this,name,age); 这样就ok了 3.什么情况下用apply,什么情况下用call 在给对象参数的情况下,如果参数的形式是数组的时候,比如apply示例里面传递了参数arguments,这个参数是数组类型,并且在调用Person的时候参数的列表是对应一致的(也就是Person和Student的参数列表前两位是一致的) 就可以采用 apply , 如果我的Person的参数列表是这样的(age,name),而Student的参数列表是(name,age,grade),这样就可以用call来实现了,也就是直接指定参数列表对应值的位置(Person.call(this,age,name,grade)); 4.apply的一些其他巧妙用法 细心的人可能已经察觉到,在我调用apply方法的时候,第一个参数是对象(this), 第二个参数是一个数组集合, 在调用Person的时候,他需要的不是一个数组,但是为什么他给我一个数组我仍然可以将数组解析为一个一个的参数, 这个就是apply的一个巧妙的用处,可以将一个数组默认的转换为一个参数列表([param1,param2,param3] 转换为 param1,param2,param3) 这个如果让我们用程序来实现将数组的每一个项,来装换为参数的列表,可能都得费一会功夫,借助apply的这点特性,所以就有了以下高效率的方法: a)Math.max 可以实现得到数组中最大的一项 因为Math.max 参数里面不支持Math.max([param1,param2]) 也就是数组 但是它支持Math.max(param1,param2,param3…),所以可以根据刚才apply的那个特点来解决 var max=Math.max.apply(null,array),这样轻易的可以得到一个数组中最大的一项 (apply会将一个数组装换为一个参数接一个参数的传递给方法) 这块在调用的时候第一个参数给了一个null,这个是因为没有对象去调用这个方法,我只需要用这个方法帮我运算,得到返回的结果就行,.所以直接传递了一个null过去 b)Math.min 可以实现得到数组中最小的一项 同样和 max是一个思想 var min=Math.min.apply(null,array); c)Array.prototype.push 可以实现两个数组合并 同样push方法没有提供push一个数组,但是它提供了push(param1,param,…paramN) 所以同样也可以通过apply来装换一下这个数组,即: vararr1=new Array("1","2","3");
vararr2=new Array("4","5","6");
Array.prototype.push.apply(arr1,arr2); 也可以这样理解,arr1调用了push方法,参数是通过apply将数组装换为参数列表的集合. 通常在什么情况下,可以使用apply类似Math.min等之类的特殊用法: 一般在目标函数只需要n个参数列表,而不接收一个数组的形式([param1[,param2[,…[,paramN]]]]),可以通过apply的方式巧妙地解决这个问题! 5.总结: 一开始我对apply 非常的不懂,最后多看了几遍,自己多敲了几遍代码,才明白了中间的道理,所以,不管做什么事情,只要自己肯动脑子,肯动手敲代码,这样一个技术就会掌握… 还有比如第四部分得内容,巧妙的解决了实实在在存在的问题,这个肯定不是一个初学者能想到的解决方案(这个也不是我自己想的),没有对编程有一定认识的不会想到这个的,还是一句话,多积累,多学习,提升自己的能力和对编程思想的理解能力才是最关键!

  原文地址:http://blog.csdn.net/business122/article/details/8000676

<li class="alt"><span><span>Js&nbsp;apply方法详解&nbsp;&nbsp;</span></span></li><li class=""><span>我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这里我做如下笔记,希望和大家分享..&nbsp;&nbsp;如有什么不对的或者说法不明确的地方希望读者多多提一些意见,以便共同提高..&nbsp;&nbsp;</span></li><li class="alt"><span>&nbsp;&nbsp;</span></li><li class=""><span>主要我是要解决一下几个问题:&nbsp;&nbsp;</span></li><li class="alt"><span>&nbsp;&nbsp;</span></li><li class=""><span>1.apply和call的区别在哪里&nbsp;&nbsp;</span></li><li class="alt"><span>&nbsp;&nbsp;</span></li><li class=""><span>2.什么情况下用apply,什么情况下用call&nbsp;&nbsp;</span></li><li class="alt"><span>&nbsp;&nbsp;</span></li><li class=""><span>3.apply的其他巧妙用法(一般在什么情况下可以使用apply)&nbsp;&nbsp;</span></li><li class="alt"><span>&nbsp;&nbsp;</span></li><li class=""><span>我首先从网上查到关于apply和call的定义,然后用示例来解释这两个方法的意思和如何去用.&nbsp;&nbsp;</span></li><li class="alt"><span>&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;apply:方法能劫持另外一个对象的方法,继承另外一个对象的属性.&nbsp;&nbsp;</span></li><li class="alt"><span>&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;Function.apply(obj,args)方法能接收两个参数&nbsp;&nbsp;</span></li><li class="alt"><span>obj:这个对象将代替Function类里<span class="keyword">this</span><span>对象&nbsp;&nbsp;</span></span></li><li class=""><span>args:这个是数组,它将作为参数传给Function(args-->arguments)&nbsp;&nbsp;</span></li><li class="alt"><span>&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;call:和apply的意思一样,只不过是参数列表不一样.&nbsp;&nbsp;</span></li><li class="alt"><span>&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;Function.call(obj,[param1[,param2[,…[,paramN]]]])&nbsp;&nbsp;</span></li><li class="alt"><span>obj:这个对象将代替Function类里<span class="keyword">this</span><span>对象&nbsp;&nbsp;</span></span></li><li class=""><span>params:这个是一个参数列表&nbsp;&nbsp;</span></li><li class="alt"><span>&nbsp;&nbsp;</span></li><li class=""><span>1.apply示例:&nbsp;&nbsp;</span></li><li class="alt"><span>&nbsp;&nbsp;</span></li><li class=""><span><script&nbsp;type=<span class="string">"text/javascript"</span><span>>&nbsp;&nbsp;&nbsp;</span></span></li><li class="alt"><span><span class="comment">/*定义一个人类*/</span><span>&nbsp;&nbsp;&nbsp;</span></span></li><li class=""><span><span class="keyword">function</span><span>&nbsp;Person(name,age)&nbsp;{&nbsp;&nbsp;&nbsp;</span></span></li><li class="alt"><span>&nbsp;&nbsp;&nbsp;&nbsp;<span class="keyword">this</span><span>.name=name;&nbsp;</span><span class="keyword">this</span><span>.age=age;&nbsp;&nbsp;&nbsp;</span></span></li><li class=""><span>}&nbsp;&nbsp;&nbsp;</span></li><li class="alt"><span>&nbsp;<span class="comment">/*定义一个学生类*/</span><span>&nbsp;&nbsp;&nbsp;</span></span></li><li class=""><span>functionStudent(name,age,grade)&nbsp;{&nbsp;&nbsp;&nbsp;</span></li><li class="alt"><span>&nbsp;&nbsp;&nbsp;&nbsp;Person.apply(<span class="keyword">this</span><span>,arguments);&nbsp;</span><span class="keyword">this</span><span>.grade=grade;&nbsp;&nbsp;&nbsp;</span></span></li><li class=""><span>}&nbsp;&nbsp;&nbsp;</span></li><li class="alt"><span><span class="comment">//创建一个学生类&nbsp;</span><span>&nbsp;&nbsp;</span></span></li><li class=""><span><span class="keyword">var</span><span>&nbsp;student=</span><span class="keyword">new</span><span>&nbsp;Student(</span><span class="string">"qian"</span><span>,21,</span><span class="string">"一年级"</span><span>);&nbsp;&nbsp;&nbsp;</span></span></li><li class="alt"><span><span class="comment">//测试&nbsp;</span><span>&nbsp;&nbsp;</span></span></li><li class=""><span>alert(<span class="string">"name:"</span><span>+student.name+</span><span class="string">"\n"</span><span>+</span><span class="string">"age:"</span><span>+student.age+</span><span class="string">"\n"</span><span>+</span><span class="string">"grade:"</span><span>+student.grade);&nbsp;&nbsp;&nbsp;</span></span></li><li class="alt"><span><span class="comment">//大家可以看到测试结果name:qian&nbsp;age:21&nbsp;grade:一年级&nbsp;</span><span>&nbsp;&nbsp;</span></span></li><li class=""><span><span class="comment">//学生类里面我没有给name和age属性赋值啊,为什么又存在这两个属性的值呢,这个就是apply的神奇之处.&nbsp;</span><span>&nbsp;&nbsp;</span></span></li><li class="alt"><span></script>&nbsp;&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>分析:&nbsp;Person.apply(<span class="keyword">this</span><span>,arguments);&nbsp;&nbsp;</span></span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span><span class="keyword">this</span><span>:在创建对象在这个时候代表的是student&nbsp;&nbsp;</span></span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>arguments:是一个数组,也就是[“qian”,”21”,”一年级”];&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>也就是通俗一点讲就是:用student去执行Person这个类里面的内容,在Person这个类里面存在<span class="keyword">this</span><span>.name等之类的语句,这样就将属性创建到了student对象里面&nbsp;&nbsp;</span></span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>&nbsp;&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>2.call示例&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>在Studen函数里面可以将apply中修改成如下:&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>Person.call(<span class="keyword">this</span><span>,name,age);&nbsp;&nbsp;</span></span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>这样就ok了&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>3.什么情况下用apply,什么情况下用call&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>在给对象参数的情况下,如果参数的形式是数组的时候,比如apply示例里面传递了参数arguments,这个参数是数组类型,并且在调用Person的时候参数的列表是对应一致的(也就是Person和Student的参数列表前两位是一致的)&nbsp;就可以采用&nbsp;apply&nbsp;,&nbsp;如果我的Person的参数列表是这样的(age,name),而Student的参数列表是(name,age,grade),这样就可以用call来实现了,也就是直接指定参数列表对应值的位置(Person.call(<span class="keyword">this</span><span>,age,name,grade));&nbsp;&nbsp;</span></span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>4.apply的一些其他巧妙用法&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>细心的人可能已经察觉到,在我调用apply方法的时候,第一个参数是对象(<span class="keyword">this</span><span>),&nbsp;第二个参数是一个数组集合,&nbsp;&nbsp;&nbsp;</span></span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>在调用Person的时候,他需要的不是一个数组,但是为什么他给我一个数组我仍然可以将数组解析为一个一个的参数,&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>这个就是apply的一个巧妙的用处,可以将一个数组默认的转换为一个参数列表([param1,param2,param3]&nbsp;转换为&nbsp;param1,param2,param3)&nbsp;这个如果让我们用程序来实现将数组的每一个项,来装换为参数的列表,可能都得费一会功夫,借助apply的这点特性,所以就有了以下高效率的方法:&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>&nbsp;&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>a)Math.max&nbsp;可以实现得到数组中最大的一项&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>因为Math.max&nbsp;参数里面不支持Math.max([param1,param2])&nbsp;也就是数组&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>但是它支持Math.max(param1,param2,param3…),所以可以根据刚才apply的那个特点来解决&nbsp;<span class="keyword">var</span><span>&nbsp;max=Math.max.apply(</span><span class="keyword">null</span><span>,array),这样轻易的可以得到一个数组中最大的一项&nbsp;&nbsp;</span></span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>(apply会将一个数组装换为一个参数接一个参数的传递给方法)&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;这块在调用的时候第一个参数给了一个<span class="keyword">null</span><span>,这个是因为没有对象去调用这个方法,我只需要用这个方法帮我运算,得到返回的结果就行,.所以直接传递了一个</span><span class="keyword">null</span><span>过去&nbsp;&nbsp;</span></span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>b)Math.min&nbsp;&nbsp;可以实现得到数组中最小的一项&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>同样和&nbsp;max是一个思想&nbsp;<span class="keyword">var</span><span>&nbsp;min=Math.min.apply(</span><span class="keyword">null</span><span>,array);&nbsp;&nbsp;</span></span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>c)Array.prototype.push&nbsp;可以实现两个数组合并&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>同样push方法没有提供push一个数组,但是它提供了push(param1,param,…paramN)&nbsp;所以同样也可以通过apply来装换一下这个数组,即:&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>vararr1=<span class="keyword">new</span><span>&nbsp;Array(</span><span class="string">"1"</span><span>,</span><span class="string">"2"</span><span>,</span><span class="string">"3"</span><span>);&nbsp;&nbsp;&nbsp;</span></span></li><li class=""><span>&nbsp;vararr2=<span class="keyword">new</span><span>&nbsp;Array(</span><span class="string">"4"</span><span>,</span><span class="string">"5"</span><span>,</span><span class="string">"6"</span><span>);&nbsp;&nbsp;&nbsp;</span></span></li><li class="alt"><span>Array.prototype.push.apply(arr1,arr2);&nbsp;&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>也可以这样理解,arr1调用了push方法,参数是通过apply将数组装换为参数列表的集合.&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>通常在什么情况下,可以使用apply类似Math.min等之类的特殊用法:&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>一般在目标函数只需要n个参数列表,而不接收一个数组的形式([param1[,param2[,…[,paramN]]]]),可以通过apply的方式巧妙地解决这个问题!&nbsp;&nbsp;</span></li><li class=""><span>&nbsp;&nbsp;</span></li><li class="alt"><span>&nbsp;&nbsp;</span></li><li class=""><span>5.总结:&nbsp;&nbsp;</span></li><li class="alt"><span>&nbsp;&nbsp;</span></li><li class=""><span>一开始我对apply&nbsp;非常的不懂,最后多看了几遍,自己多敲了几遍代码,才明白了中间的道理,所以,不管做什么事情,只要自己肯动脑子,肯动手敲代码,这样一个技术就会掌握…&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span></li><li class="alt"><span>&nbsp;&nbsp;</span></li><li class=""><span>还有比如第四部分得内容,巧妙的解决了实实在在存在的问题,这个肯定不是一个初学者能想到的解决方案(这个也不是我自己想的),没有对编程有一定认识的不会想到这个的,还是一句话,多积累,多学习,提升自己的能力和对编程思想的理解能力才是最关键!&nbsp;&nbsp;</span></li>

apply 和call 的区别,apply实用小技巧的更多相关文章

  1. PHP 常用函数库和一些实用小技巧

    PHP 常用函数库和一些实用小技巧 作者: 字体:[增加 减小] 类型:转载   包括文件读取函式,文件写入函式,静态页面生成函式,目录删除函式等   文件读取函式 //文件读取函式 function ...

  2. Vim实用小技巧

    Vim实用小技巧 一些网络上质量较高的Vim资料 从我07年接触Vim以来,已经过去了8个年头,期间看过很多的Vim文章,我自己觉得非常不错,而且创作时间也比较近的文章有如下这些. Vim入门 目前为 ...

  3. svn checkout 实用小技巧

    svn checkout 实用小技巧 by:授客 QQ:1033553122   问题描述: 用svn小乌龟软件,进行update,commit之前,先要把svn工作目录checkout到本地,那么问 ...

  4. 实用小技巧(一):UIScrollView中上下左右滚动方向的判断

    https://www.jianshu.com/p/93e8459b6dae 2017.06.01 01:13* 字数 674 阅读 1201评论 0喜欢 1 2017.06.01 01:13* 字数 ...

  5. VC6.0实用小技巧

    VC6.0的若干实用小技巧 .检测程序中的括号是否匹配 把光标移动到需要检测的括号(如大括号{}.方括号[].圆括号()和尖括号<>)前面,键入快捷键 “Ctrl+]”.如果括号匹配正确, ...

  6. 必看!macOS进阶不得不知的实用小技巧

    不知道大家对使用苹果电脑的体验如何?您充分利用您的mac了吗?其实macOS上存在着许多快捷方式和技巧可以帮助简化我们的工作流程,提高效率,但是在日常生活中经常被人们忽略或者遗忘.以下是macdown ...

  7. 实用小技巧:Notepad++直接连接Linux

    实用小技巧:Notepad++直接连接Linux 前言 号称编辑器之神的Vim对于只会用几个基础操作的本人而言,在编辑一些大型文本有那么些力不从心: 平时都是通过Xftp拖到本地,修改完后再覆盖回去: ...

  8. Maven在Eclipse中的实用小技巧

    前言     我们在开发的工程中很多都是Maven项目,这样更加便于我们jar包的管理.而我们一般使用的IDE都是Eclipse,由于我们在日常的开发过程中会经常要用到一些Maven的操作,所以我今天 ...

  9. Visual Studio实用小技巧

    有一个有关微软Office的笑话,说的是它的特性太多: 当你觉得自己发现了一个Office的新特性时,它已经存在很多年了. 本文将介绍一些在Visual Studio(免费下载)中很实用却被忽略的小技 ...

随机推荐

  1. Python爬取网易云歌单

    目录 1. 关键点 2. 效果图 3. 源代码 1. 关键点 使用单线程爬取,未登录,爬取网易云歌单主要有三个关键点: url为https://music.163.com/discover/playl ...

  2. redis linux(centos) 安装

    前言 redis 大家都使用过, 可以安装在windows下, 也可以安装在linux下, 一般还是linux下安装比较多. 这里来介绍一下redis在linux下的安装 一. 下载 https:// ...

  3. github总结(2)--怎样在github上面创建新的分支

    part I:添加新的分支步骤分解 第一步:git branch 查看当前分支情况 git branch //查看当前分支情况 第二步:git branch 分支名,新建一个自己的分支 git bra ...

  4. ContextLoaderListener可以不写嘛?

    写了那么久的Spring,经常写这样的配置,这就是几行Spring.SpringMvc的基本配置, 但是最近也看到不写最前面的context-param以及listener的,好奇记录下. <c ...

  5. 【图文详细教程】maven3安装配置+eclipse离线安装maven3插件《《唯一成功的教程~~~2018-01-09》》

    环境搭建前提: 1.电脑上已经安装了1.7以及以上版本的JDK(因为我提供的maven版本是最新的3.3.9的,要求最低JDK1.7) 2.配置好了ecplise并且能正常启动 第一步:下载maven ...

  6. Tomcat 服务器安装 SSL证书,实现 HTTP 自动跳转 HTTPS

    本文以阿里云为例: 一.下载证书 1.1.登录阿里云:https://www.aliyun.com/ 1.2.控制台搜索:SSL证书 1.3.进入 SSL证书控制台 1.4.申请免费 SSL证书,已有 ...

  7. JavaScript模拟自由落体

    1.效果图 2.实现分析 利用Canvas画圆球.地面: 1.下落过程 物理知识回顾,物体下落过程(不计损耗)由重力势能转换成动能 重力势能 Ep = mgh 动能  Ek = (1/2)mv^2 速 ...

  8. css布局------块元素水平垂直居中的四种方法

    HTML <div class="parent answer-1"> <div></div></div> CSS .parent { ...

  9. c# 匿名方法几种表现形式

    delegate int del(int a); static void Main(string[] args) { //匿名方法的几种表现形式 del del = delegate (int x) ...

  10. [PHP] 算法-二位有序数组中查找的PHP实现

    在一个二维数组中(每个一维数组的长度相同),每一行都按照从左到右递增的顺序排序,每一列都按照从上到下递增的顺序排序.请完成一个函数,输入这样的一个二维数组和一个整数,判断数组中是否含有该整数. 1.二 ...