当前位置: 首页 > news >正文

call、apply、bind 详解

在 JavaScript 中,`call`、`apply` 和 `bind` 是 Function 对象的三个重要方法,它们都与函数的上下文(`this` 值)和参数传递有关。

一、`call` 方法

1. 语法

function.call(thisArg, arg1, arg2, ...)

2. 示例代码

const person = {name: "John",greet: function (message) {console.log(`${message}, ${this.name}`);},};const anotherPerson = {name: "Jane",};// 使用 call 方法调用 greet 函数,并指定 this 为 anotherPersonperson.greet.call(anotherPerson, "Hello");// 最终输出 `Hello, Jane`。

二、`apply` 方法

1. 语法

function.apply(thisArg, [argsArray])

2. 示例代码

const numbers = [5, 6, 2, 3, 7];// 使用 Math.max 函数找出数组中的最大值const max = Math.max.apply(null, numbers);console.log(max);// 最终输出 7。

三、`bind` 方法

1. 语法

function.bind(thisArg, arg1, arg2, ...)

2. 示例代码

const person = {name: "John",greet: function (message) {console.log(`${message}, ${this.name}`);},};const anotherPerson = {name: "Jane",};// 使用 bind 方法创建一个新的函数,并指定 this 为 anotherPersonconst newGreet = person.greet.bind(anotherPerson);// 调用新函数newGreet("Hi");

四、三者的区别

1. 调用方式

`call` 和 `apply` 会立即调用函数,而 `bind` 会返回一个新的函数,需要手动调用这个新函数。

2. 参数传递方式

`call` 方法接受多个参数,参数之间用逗号分隔。

`apply` 方法接受两个参数,第二个参数是一个数组或类数组对象,数组中的元素会作为参数传递给函数。

`bind` 方法可以在创建新函数时预设一些参数,这些参数会在调用新函数时作为前置参数。

五、使用场景

1. `call` 和 `apply`

当需要在调用函数时动态改变 `this` 值,并且已知参数数量时,使用 `call` 方法。

当需要传递的参数存储在数组中时,使用 `apply` 方法,例如调用 `Math.max` 或 `Math.min` 函数处理数组元素。

2. `bind`

当需要创建一个新函数,并且希望这个新函数始终具有特定的 `this` 值时,使用 `bind` 方法。常见于事件处理函数中,确保 `this` 指向正确的对象。

相关文章:

call、apply、bind 详解

在 JavaScript 中,call、apply 和 bind 是 Function 对象的三个重要方法,它们都与函数的上下文(this 值)和参数传递有关。 一、call 方法 1. 语法 function.call(thisArg, arg1, arg2, ...) 2. 示例代码 const person {name…...

详解电子邮箱工作原理|SMTP、POP3、IMAP、SPF、MIME

写在前面 电子邮件(Email)是一种通过互联网进行异步通信的技术,工作原理涉及多个协议、服务器和客户端协同工作。 接下来我们来介绍一下电子邮箱的工作原理 1. 电子邮件的核心组成部分 邮件客户端:用户直接交互的软件&#xf…...

QT笔记——QPlainTextEdit

文章目录 1、概要2、文本设计2.1、设置文本2.1、字体样式(大小、下划线、加粗、斜体) 1、概要 QPlainTextEdit 是 Qt 框架中用于处理纯文本编辑的控件,具有轻量级和高效的特点,以下是它常见的应用场景: 文本编辑器&am…...

Qt使用pri和pro文件进行模块化编程

假如我想要做一个功能,这个功能用代码模块化实现出来,方便将来移植,比如音视频播放器的界面,将来想要在其他工程使用时,只需要将widget提升为音视频播放界面即可。 当我们其他工程需要这个功能时,我们在调用…...

Linux-文件基本操作

1.基本概念 文件: 一组相关数据的集合 文件名: 01.sh //文件名 2.linux下的文件类型 b block 块设备文件 eg: 硬盘 c character 字符设备文件 eg: 鼠标,键盘 d directory 目录文件 eg: 文件夹 - regular 常规文件…...

自己部署 DeepSeek 助力 Vue 开发:打造丝滑的时间线(Timeline )

前言:哈喽,大家好,今天给大家分享一篇文章!并提供具体代码帮助大家深入理解,彻底掌握!创作不易,如果能帮助到大家或者给大家一些灵感和启发,欢迎收藏关注哦 💕 目录 自己…...

初窥强大,AI识别技术实现图像转文字(OCR技术)

⭐️⭐️⭐️⭐️⭐️欢迎来到我的博客⭐️⭐️⭐️⭐️⭐️ 🐴作者:秋无之地 🐴简介:CSDN爬虫、后端、大数据、人工智能领域创作者。目前从事python全栈、爬虫和人工智能等相关工作,主要擅长领域有:python…...

【Apache Paimon】-- 作为一名小白,如何系统地学习 Apache paimon?

目录 一、整体规划 1. 了解基本概念与背景 2. 学习资料的选择 3. 学习路径与规划 4. 学习建议 5. 注意事项 6. 参考学习资料 二、详细计划 阶段 1:了解基础(1-2 周) 阶段 2:深入掌握核心功能(3-4 周&#xf…...

Elasticvue使用总结

用了好多es的可视化客户端,但平时用的最多的是Elasticvue这个浏览器插件。总结一下使用教程。 连接 首页大盘 说明: 节点情况:一共三个节点,三个节点既是master节点又是data节点。(一个节点可以既是master又是data&a…...

尚硅谷爬虫note002

一、for循环 语法: for 变量 in 要遍历的数据 方法体 【for i in 要遍历的数据】:字符串中 i 表示变量 1. 循环字符串 2. range(5)方法 :0~4 for i in range(5) 3. range(1&…...

小白零基础如何搭建CNN

1.面向对象编程 1.1类(Class)和对象(Object) class Animal:"""定义一个动物类Animal,包含基本属性和行为。"""def __init__(self, name, species, age0):"""__init__…...

在vivado中对数据进行延时,时序对齐问题上的理清

在verilog的ISP处理流程中,在完成第一个模块的过程中,我经常感到困惑,到底是延时了多少个时钟?今日对这几个进行分类理解。 目录 1.输入信号激励源描述 1.1将数据延时[9]个clk 1.2将vtdc与hzdc延时[9]个clk(等价于单bit的数据…...

《只狼》运行时提示“mfc140u.dll文件缺失”是什么原因?要怎么解决?

《只狼》运行时提示“mfc140u.dll文件缺失”是什么原因?要怎么解决? 宝子们,是不是在玩《只狼》的时候,突然弹出一个提示:“找不到mfc140u.dll文件”?这可真是让人着急上火!别慌,今…...

vue学习笔记7

打包发布 目标:明确打包的作用 说明:vue脚手架只是开发过程中,协助开发的工具,当真正开发完了 > 脚手架不参与上线 打包的作用: 将多个文件压缩合并成一个文件,语法降级,less sass ts 语法…...

Unity 增量打包AssetBundle

背景 打包太慢了,想要没改动的资源不重新打包浪费时间。 来源 官方文章:https://forum.unity.com/threads/about-incremental-build-and-asset-bundle-hashes.1436032/ 官网AB介绍:https://learn.unity.com/tutorial/assets-resources-and…...

嵌入式八股文面试题(二)C语言算法

相关概念请查看文章&#xff1a;C语言概念。 1. 如何实现一个简单的内存池&#xff1f; 简单实现&#xff1a; #include <stdio.h> #include <stdlib.h>//内存块 typedef struct MemoryBlock {void *data; // 内存块起始地址struct MemoryBlock *next; // 下一个内…...

尚硅谷爬虫note005

一、编解码 1.get请求的quote方法 将汉字转为Unicode字符 # _*_ coding : utf-8 _*_ # Time : 2025/2/12 16:33 # Author : 20250206-里奥 # File : demo19_get请求的quote方法 # Project : PythonProject10-14# 景甜page # https://www.baidu.com/s?ieutf-8&f8&rsv…...

xml 和json互转工具

工具1 有个问题会导致springboot返回捕获的异常编程xml格式 import com.fasterxml.jackson.databind.ObjectMapper; import com.fasterxml.jackson.dataformat.xml.XmlMapper; import org.json.JSONObject; import org.json.XML; import org.w3c.dom.Document;import javax.xm…...

ElementUI 抽屉组件高度封装

在前端开发中&#xff0c;ElementUI 的el-drawer组件虽实用&#xff0c;但为满足复杂业务需求&#xff0c;如统一样式、特定交互和灵活使用&#xff0c;常需二次封装。下面将带你实现一个高度封装的 ElementUI 抽屉组件。 创建基础封装组件 创建MyDrawer.vue&#xff0c;引入e…...

深入解析:如何在C#和C/C++之间安全高效地通过P/Invoke传递多维数组

在工业控制、机器人编程和物联网等领域&#xff0c;我们经常需要让C#这样的托管语言与C/C编写的底层库进行交互。在这个过程中&#xff0c;遇到需要传递多维数组的场景时&#xff0c;许多开发者会意外遭遇System.Runtime.InteropServices.MarshalDirectiveException异常。本文将…...

微信小程序之bind和catch

这两个呢&#xff0c;都是绑定事件用的&#xff0c;具体使用有些小区别。 官方文档&#xff1a; 事件冒泡处理不同 bind&#xff1a;绑定的事件会向上冒泡&#xff0c;即触发当前组件的事件后&#xff0c;还会继续触发父组件的相同事件。例如&#xff0c;有一个子视图绑定了b…...

树莓派超全系列教程文档--(61)树莓派摄像头高级使用方法

树莓派摄像头高级使用方法 配置通过调谐文件来调整相机行为 使用多个摄像头安装 libcam 和 rpicam-apps依赖关系开发包 文章来源&#xff1a; http://raspberry.dns8844.cn/documentation 原文网址 配置 大多数用例自动工作&#xff0c;无需更改相机配置。但是&#xff0c;一…...

Python实现prophet 理论及参数优化

文章目录 Prophet理论及模型参数介绍Python代码完整实现prophet 添加外部数据进行模型优化 之前初步学习prophet的时候&#xff0c;写过一篇简单实现&#xff0c;后期随着对该模型的深入研究&#xff0c;本次记录涉及到prophet 的公式以及参数调优&#xff0c;从公式可以更直观…...

spring:实例工厂方法获取bean

spring处理使用静态工厂方法获取bean实例&#xff0c;也可以通过实例工厂方法获取bean实例。 实例工厂方法步骤如下&#xff1a; 定义实例工厂类&#xff08;Java代码&#xff09;&#xff0c;定义实例工厂&#xff08;xml&#xff09;&#xff0c;定义调用实例工厂&#xff…...

Linux-07 ubuntu 的 chrome 启动不了

文章目录 问题原因解决步骤一、卸载旧版chrome二、重新安装chorme三、启动不了&#xff0c;报错如下四、启动不了&#xff0c;解决如下 总结 问题原因 在应用中可以看到chrome&#xff0c;但是打不开(说明&#xff1a;原来的ubuntu系统出问题了&#xff0c;这个是备用的硬盘&a…...

【VLNs篇】07:NavRL—在动态环境中学习安全飞行

项目内容论文标题NavRL: 在动态环境中学习安全飞行 (NavRL: Learning Safe Flight in Dynamic Environments)核心问题解决无人机在包含静态和动态障碍物的复杂环境中进行安全、高效自主导航的挑战&#xff0c;克服传统方法和现有强化学习方法的局限性。核心算法基于近端策略优化…...

QT3D学习笔记——圆台、圆锥

类名作用Qt3DWindow3D渲染窗口容器QEntity场景中的实体&#xff08;对象或容器&#xff09;QCamera控制观察视角QPointLight点光源QConeMesh圆锥几何网格QTransform控制实体的位置/旋转/缩放QPhongMaterialPhong光照材质&#xff08;定义颜色、反光等&#xff09;QFirstPersonC…...

AirSim/Cosys-AirSim 游戏开发(四)外部固定位置监控相机

这个博客介绍了如何通过 settings.json 文件添加一个无人机外的 固定位置监控相机&#xff0c;因为在使用过程中发现 Airsim 对外部监控相机的描述模糊&#xff0c;而 Cosys-Airsim 在官方文档中没有提供外部监控相机设置&#xff0c;最后在源码示例中找到了&#xff0c;所以感…...

Mysql8 忘记密码重置,以及问题解决

1.使用免密登录 找到配置MySQL文件&#xff0c;我的文件路径是/etc/mysql/my.cnf&#xff0c;有的人的是/etc/mysql/mysql.cnf 在里最后加入 skip-grant-tables重启MySQL服务 service mysql restartShutting down MySQL… SUCCESS! Starting MySQL… SUCCESS! 重启成功 2.登…...

免费数学几何作图web平台

光锐软件免费数学工具&#xff0c;maths,数学制图&#xff0c;数学作图&#xff0c;几何作图&#xff0c;几何&#xff0c;AR开发,AR教育,增强现实,软件公司,XR,MR,VR,虚拟仿真,虚拟现实,混合现实,教育科技产品,职业模拟培训,高保真VR场景,结构互动课件,元宇宙http://xaglare.c…...