Js apply方法详解

2023-11-08

Js apply方法详解
主要解决一下几个问题:

apply和call的区别在哪里
什么情况下用apply,什么情况下用call
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;  
    }  
    /*定义一个学生类*/  
    function Student(name,age,grade)  
    {  
        Person.apply(this,arguments);  
        this.grade=grade;  
    }  
    //创建一个学生类  
    var student=new Student("zhangsan",21,"一年级");  
    //测试  
    alert("name:"+student.name+"\n"+"age:"+student.age+"\n"+"grade:"+student.grade);  
    //大家可以看到测试结果name:zhangsan age:21  grade:一年级  
    //学生类里面我没有给name和age属性赋值啊,为什么又存在这两个属性的值呢,这个就是apply的神奇之处.  
</script>  

分析: Person.apply(this,arguments);
this:在创建对象在这个时候代表的是student
arguments:是一个数组,也就是[“zhangsan”,”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来装换一下这个数组,即:

var arr1=new Array("1","2","3");  
  
var arr2=new Array("4","5","6");  
  
Array.prototype.push.apply(arr1,arr2);  

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

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

一般在目标函数只需要n个参数列表,而不接收一个数组的形式([param1[,param2[,…[,paramN]]]]),可以通过apply的方式巧妙地解决这个问题!

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Js apply方法详解 的相关文章

  • 我如何在 AngularJS 中监听点击并按住的情况?

    我制作了一个时间计数器 您可以通过单击按钮来增加或减少时间 然而 我希望当我单击并按住按钮时 时间的价值会不断攀升 所以目前如果你看到我的Plunkr http plnkr co edit BxX9x5zYFMXVqt5JsN1F p pr
  • chrome 调试器承诺在暂停时不会解析?

    也许我没有正确调试承诺 但基本上 如果您在断点处停止并运行异步代码 它实际上不会完成 直到您恢复执行为止 这是一个问题 调试器允许您快速试验多个 api 方法 但如果您恢复它 您就不能 debugger now type the follo
  • HTML/VBA Click 事件未触发

    这是我第一次在 StackOverflow 上发布问题 到目前为止 我已经能够通过 VBA 帮助论坛解决我的大部分问题 我的问题很简单 我有一个自动数据拉取 我需要在其中导出数据 我过去曾在这方面取得过成功 但这次略有不同 我尝试单击以生成
  • 如何使用 selenium 和 Mocha 获取 xPath() 选择的锚标记的文本

    我已经成功选择了 a 标签 我想显示锚标记的文本 但无法这样做 我正在使用 selenium mocha javascript 和 phantomJS 这是我的脚本 详细 var assert require assert var test
  • 消息“在 jest.setTimeout 指定的 5000 毫秒超时内未调用异步回调”

    我正在使用 Puppeteer 和 Jest 来运行一些前端测试 我的测试如下 describe Profile Tab Exists and Clickable settings user gt test Assert that you
  • 动画进度元素值

    我有一个progress元素 该元素如下所示 div class container div div div
  • 如何使用canvas.toDataURL()将画布保存为图像?

    我目前正在构建一个 HTML5 Web 应用程序 Phonegap 本机应用程序 我似乎不知道如何将画布保存为图像canvas toDataURL 有人可以帮我吗 这是代码 有什么问题吗 我的画布被命名为 canvasSignature J
  • Ember.js 处理 View 事件后转换到路由

    Setup 我有一个 Ember 应用程序 支持使用 Imgur API 上传图像 我已经有一个工作路线和模板来处理任何 Imgur ID 但我想在上传新图像后转换到此路线 使用返回的 Imgur ID 这是该应用程序的相关部分 http
  • 是否可以使用 javascript 测试用户的浏览器/操作系统是否支持给定类型的链接?

    是否可以使用 javascript 或其他任何东西 测试用户的操作系统 浏览器是否支持给定的 url 方案 例如 大多数仅使用网络邮件的用户计算机上未设置 mailto 是否有可能以某种方式捕获单击 mailto 链接的尝试并弹出比浏览器错
  • javascript中按tab键时如何调用函数?

    我有一个这样的功能 function whenEmpty field if field value field style backgroundColor ffcccc alert Please fill the field field f
  • Google Chrome 106 可拖动导致元素消失

    使用拖放元素时 绝对定位元素中包含的大多数其他元素都会从屏幕上消失 如果我调整窗口大小 这些元素会出现 但在开始拖动时会再次消失 我在最新版本的 Google Chrome 106 和 Beta 版本 107 0 5304 18 以及现在的
  • 如何在 Angular 中从父组件访问子组件?

    I have mat paginator在子组件a中 如下所示 子组件 html
  • Typeahead.js substringMatcher 函数说明

    我只是在做一些研究Typeahead js这是一个非常酷的图书馆 感谢文档 我已经成功地获得了一个基本的示例 该文档也非常好 但是我试图弄清楚以下代码块实际上在做什么 var substringMatcher function strs r
  • JS用正则表达式替换数字

    我有元素的标识符 如下所示 form book 1 2 3 我想要的是用其他值替换该标识符中的第二个数字 我将函数 match 与以下正则表达式一起使用 var regexp d d d 但它返回我包含的数组 1 2 3 2 因此 当我尝试
  • 淡出和循环一组 div 的最佳方式

    假设我有以下 div div class a You are funny div div class b You are smart div div class c You are cool div 最好的展示方式是什么div a持续 5
  • 查询为空 Node Js Sequelize

    我正在尝试更新 Node js 应用程序中的数据 我和邮递员测试过 我的开发步骤是 从数据库 MySQL 获取ID为10的数据进行更新 gt gt 未处理的拒绝SequelizeDatabaseError 查询为空 我认识到 我使用了错误的
  • 如果数字小于 10,则显示前导零 [重复]

    这个问题在这里已经有答案了 可能的重复 JavaScript 相当于 printf string format https stackoverflow com questions 610406 javascript equivalent t
  • 数据表日期范围过滤器

    如何添加日期范围过滤器 like From To 我开始进行常规搜索和分页等工作 但我不知道如何制作日期范围过滤器 我正在使用数据表 1 10 11 版本 My code var oTable function callFilesTable
  • 如何在 Google 地图 V3 中创建编号地图标记?

    我正在制作一张上面有多个标记的地图 这些标记使用自定义图标 但我还想在顶部添加数字 我已经了解了如何使用旧版本的 API 来实现这一点 我怎样才能在V3中做到这一点 注意 当您将鼠标悬停在标记上时 标题 属性会创建一个工具提示 但我希望即使
  • KeyboardAvoidingView - 隐藏键盘时重置高度

    我正在使用 React NativeKeyboardAvoidingView设置我的高度View当显示键盘时 但是当我关闭应用程序中的键盘时 视图的高度不会变回原来的值

随机推荐

  • 「玩物志」来自 Jigsaw 的 Outline

    前段时间 来自谷歌 Google 母公司 Alphabet 旗下的科技孵化器 Jigsaw 开发了一款名为 Outline 的代理软件 我们今天就来体验一下谷歌同门开发的这款应用 看看它有没有给我们带来什么惊喜 关于 Outline 其实
  • 指针复习,注意小的知识点

    include
  • 【嵌入式】——理论基础

    STM32初探 一 计算机组成 1 嵌入式系统 1 1 什么是嵌入式系统 1 2 嵌入式系统组成 2 计算机系统 2 1 冯 诺伊曼结构 普林斯顿结构 2 2 哈佛架构 Harvard Architecture 3 各组件是如何通信的 3
  • 丽升评卷系统显示服务器地址错误,A3_丽升评卷系统评卷员操作方法-副本(2页)-原创力文档...

    PAGE PAGE 2 丽升评卷系统评卷员操作方法 操作方法说明将文字和图片结合 优化了叙述的条理性 尽量做到简洁明了 通俗易懂 即便不经培训 也可以独立动手操作 一 双击桌面上的丽升图标 弹出 用户登录 窗口 输入阅卷服务器IP地址 服务
  • Android手机上剪藏笔记到Obsidian

    前两天 Obsidian 正式发布了 v1 0 0 这两年老苏一直只是把 Obsidian 当一个 Markdown 编辑器在使用 是时候花时间研究怎么用 Obsidian 真正成为一个知识管理工具了 关于 Obsidian 详细的版本更新
  • Gensim word2vec计算多个词之间的相似度

    使用most similar 函数即可 代码如下 from gensim models import Word2Vec word model Word2Vec load wiki word2vec model 导入模型 word model
  • 用awk编写Shell脚本

    一 概述 1 产品概述 awk是一种编程语言 用于在linux unix下对文本和数据进行扫描与处理 数据可以来自标准输入 文件 管道 awk分别代表其作者姓氏的第一个字母 因为它的作者是三个人 分别是Alfred Aho Peter We
  • 吴恩达《机器学习》——线性回归代码实现

    线性回归 1 单变量线性回归 单变量线性回归公式 损失函数 优化算法 批梯度下降 BGD 2 多变量线性回归 特征缩放 标准化 参数的逆缩放 3 线性回归算法代码实现 向量实现 Python代码 4 实验结果 单变量回归 多变量回归 实验总
  • Ubuntu 14.04 64位上配置JDK操作步骤

    1 从 http www oracle com technetwork java javase downloads jdk8 downloads 2133151 html 下载jdk 8u172 linux x64 tar gz 2 解压缩
  • 软件测试期末总复习(知识点+习题+答案)

    目录 1 软件测试基础 1 1软件概述 1 1 1软件的生命周期 1 1 2 软件开发模型 1 1 3 软件质量概述 1 2 软件缺陷管理 1 2 1 软件缺陷产生的原因 1 2 2 软件缺陷的分类 1 2 3 软件缺陷的处理流程 1 3
  • jvm之java类加载机制和类加载器(ClassLoader)的详解

    当程序主动使用某个类时 如果该类还未被加载到内存中 则JVM会通过加载 连接 初始化3个步骤来对该类进行初始化 如果没有意外 JVM将会连续完成3个步骤 所以有时也把这个3个步骤统称为类加载或类初始化 一 类加载过程 1 加载 加载指的是将
  • 无线连接服务器 很慢,无线网很慢是什么原因

    大家好 我是时间财富网智能客服时间君 上述问题将由我为大家进行解答 无线网很慢的原因有 1 连接的网站所在的服务器带宽不足或负载过大 2 网线接触不良或者交换机的硬件原因导致 3 电脑本身存储文件过多等 所谓无线网络 是指无需布线就能实现各
  • 2022年天梯赛比赛真题,L1基础题,C语言,没有算法的那种

    目录 L1 1 今天我要赢 5 分 L1 2 种钻石 5 分 L1 3 谁能进图书馆 10 分 L1 4 拯救外星人 10 分 L1 5 试试手气 15 分 L1 6 斯德哥尔摩火车上的题 15 分 L1 7 机工士姆斯塔迪奥 20 分 L
  • spdk理解

    核跟线程的关系 在理解spdk 特别是spdk线程模型前 需要清楚cpu核跟线程的关系 首先 关于计算机系统的很多概念 都有 逻辑层 和 物理层 的区分 这个是前提 然后再看 核心 这个概念是 物理层 的概念 指的就是 CPU硬件的物理核心
  • OpenGL assimp库,编译 ‘File too big‘,‘too many sections’,IFCReaderGen.cpp 中报错

    QT环境下配置Assimp库 MinGW编译器 48条消息 QT环境下配置Assimp库 MinGW编译器 Elsa的迷弟的博客 CSDN博客 IFCReaderGen cpp 中报错 too many sections问题 如下图所示 此
  • SpringBoot整合kafka(实现consumer)

    如何在springboot中集成kafka收消息 1 pom xml引入依赖的jar包
  • 初始化和实例化的区别

    类的初始化 是完成程序执行前的准备工作 在这个阶段 静态的 变量 方法 代码块 会被执行 同时在会开辟一块存储空间用来存放静态的数据 初始化只在类加载的时候执行一次 类的实例化 是指创建一个对象的过程 这个过程中会在堆中开辟内存 将一些非静
  • php模式之装饰器模式2

    原文来自 大胖博客 在上一篇文章中 介绍了如何在代码架构之初 为了以后的扩展方便做的考虑 那么在现实中大部分的情况不是如此 那么我们需要重构这块么 不一定 今天我们使用另一种方式来实现装饰器 假设现在我们处在产品的第二个阶段 有下面第一阶段
  • 前端微信支付步骤(笔记)

    对接了两次微信支付 第一次对接的时候没有做记录下来 这一次把要记录下来 一 获取openId 1 在微信公众平台配置相关信息 具体按照微信官方文档步骤进行配置 mp weixin qq com wiki t reso 2 微信网页授权 文档
  • Js apply方法详解

    Js apply方法详解 主要解决一下几个问题 apply和call的区别在哪里 什么情况下用apply 什么情况下用call apply的其他巧妙用法 一般在什么情况下可以使用apply 首先从网上查到关于apply和call的定义 然后