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. 电子邮件的核心组成部分 邮件客户端:用户直接交互的软件…...
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 周…...
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语言算法
相关概念请查看文章:C语言概念。 1. 如何实现一个简单的内存池? 简单实现: #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 抽屉组件高度封装
在前端开发中,ElementUI 的el-drawer组件虽实用,但为满足复杂业务需求,如统一样式、特定交互和灵活使用,常需二次封装。下面将带你实现一个高度封装的 ElementUI 抽屉组件。 创建基础封装组件 创建MyDrawer.vue,引入e…...
深入解析:如何在C#和C/C++之间安全高效地通过P/Invoke传递多维数组
在工业控制、机器人编程和物联网等领域,我们经常需要让C#这样的托管语言与C/C编写的底层库进行交互。在这个过程中,遇到需要传递多维数组的场景时,许多开发者会意外遭遇System.Runtime.InteropServices.MarshalDirectiveException异常。本文将…...
后进先出(LIFO)详解
LIFO 是 Last In, First Out 的缩写,中文译为后进先出。这是一种数据结构的工作原则,类似于一摞盘子或一叠书本: 最后放进去的元素最先出来 -想象往筒状容器里放盘子: (1)你放进的最后一个盘子(…...
STM32标准库-DMA直接存储器存取
文章目录 一、DMA1.1简介1.2存储器映像1.3DMA框图1.4DMA基本结构1.5DMA请求1.6数据宽度与对齐1.7数据转运DMA1.8ADC扫描模式DMA 二、数据转运DMA2.1接线图2.2代码2.3相关API 一、DMA 1.1简介 DMA(Direct Memory Access)直接存储器存取 DMA可以提供外设…...
2025 后端自学UNIAPP【项目实战:旅游项目】6、我的收藏页面
代码框架视图 1、先添加一个获取收藏景点的列表请求 【在文件my_api.js文件中添加】 // 引入公共的请求封装 import http from ./my_http.js// 登录接口(适配服务端返回 Token) export const login async (code, avatar) > {const res await http…...
C++中string流知识详解和示例
一、概览与类体系 C 提供三种基于内存字符串的流,定义在 <sstream> 中: std::istringstream:输入流,从已有字符串中读取并解析。std::ostringstream:输出流,向内部缓冲区写入内容,最终取…...
html css js网页制作成品——HTML+CSS榴莲商城网页设计(4页)附源码
目录 一、👨🎓网站题目 二、✍️网站描述 三、📚网站介绍 四、🌐网站效果 五、🪓 代码实现 🧱HTML 六、🥇 如何让学习不再盲目 七、🎁更多干货 一、👨…...
IP如何挑?2025年海外专线IP如何购买?
你花了时间和预算买了IP,结果IP质量不佳,项目效率低下不说,还可能带来莫名的网络问题,是不是太闹心了?尤其是在面对海外专线IP时,到底怎么才能买到适合自己的呢?所以,挑IP绝对是个技…...
招商蛇口 | 执笔CID,启幕低密生活新境
作为中国城市生长的力量,招商蛇口以“美好生活承载者”为使命,深耕全球111座城市,以央企担当匠造时代理想人居。从深圳湾的开拓基因到西安高新CID的战略落子,招商蛇口始终与城市发展同频共振,以建筑诠释对土地与生活的…...
NPOI操作EXCEL文件 ——CAD C# 二次开发
缺点:dll.版本容易加载错误。CAD加载插件时,没有加载所有类库。插件运行过程中用到某个类库,会从CAD的安装目录找,找不到就报错了。 【方案2】让CAD在加载过程中把类库加载到内存 【方案3】是发现缺少了哪个库,就用插件程序加载进…...
二维FDTD算法仿真
二维FDTD算法仿真,并带完全匹配层,输入波形为高斯波、平面波 FDTD_二维/FDTD.zip , 6075 FDTD_二维/FDTD_31.m , 1029 FDTD_二维/FDTD_32.m , 2806 FDTD_二维/FDTD_33.m , 3782 FDTD_二维/FDTD_34.m , 4182 FDTD_二维/FDTD_35.m , 4793...
深入理解 React 样式方案
React 的样式方案较多,在应用开发初期,开发者需要根据项目业务具体情况选择对应样式方案。React 样式方案主要有: 1. 内联样式 2. module css 3. css in js 4. tailwind css 这些方案中,均有各自的优势和缺点。 1. 方案优劣势 1. 内联样式: 简单直观,适合动态样式和…...
