改变this指向的三种方式

题记:为什么我们要使用改变this指向?

        我们思考一下,我们往往获取值的方式有下边几种情况,比如自己声明,另外就是通过原型链去找对吗,但是如果你又没有声明,原型链上有没有,那么怎么办呢?就偷,改变this其实就是把其他家的钥匙拿到,取别人的东西。

call()

function.call(thisArg, 参数1, 参数2, 参数3…)
function: 要改变this指向的原函数
thisArg: 要改变到的this指向的目标对象

function fn(animal) {this.animal = animalconsole.log('this', this)this.b()
}const obj = {animal:'tiger',b: function() {console.log(`${this.animal} is a man-eating animal`)}
}fn.call(obj,'laohu')

 

apply()

function.apply(thisArg, [参数1, 参数2, 参数3…])
function: 要改变this指向的原函数
thisArg: 要改变到的this指向的目标对象

function fn(animal) {this.animal = animalconsole.log('this', this)this.b()
}const obj = {animal:'tiger',b: function() {console.log(`${this.animal} is a man-eating animal`)}
}fn.apply(obj,['laohu'])

 

bind()

funtion.bind(thisArg, 参数1, 参数2, 参数3…)
function: 要改变this指向的原函数
thisArg: 要改变到的this指向的目标对象
该方法并不会调用函数,仅仅改变了this指向

 

function fn(animal) {this.animal = animalconsole.log('this', this)this.b()
}const obj = {animal:'tiger',b: function() {console.log(`${this.animal} is a man-eating animal`)}
}let fnn = fn.bind(obj,'laohu')
fnn()

总结:我们可以看到三个方法都得到了相应的结果,但是我们需要思考两件事,为什么要弄三个?另外就是三个代码书写都什么不同吗?

不同之处:

参数不同:1、apply()的参数是数组形式,可调用 ;2、bind()返回的是一个函数,需要再次调用才行。

我们再想一想,bind()的使用场景就是我们有的时候需要更换this,但是又不想调用,这个不就好了吗?

另外我们常常继承用call,apply经常和数组有关系,比如想用Math里边的函数等等!!!

寄语:

临近新年,希望各位大佬家庭和睦,家人健康,工作顺利。

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

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

相关文章

【Redis】Redis 进阶

文章目录 1. BigKey1.1 MoreKey1.2 BigKey 2. 缓存双写一致性更新策略2.1 读缓存数据2.2 数据库和缓存一致性的更新策略2.3 canal 实现双写一致性 3. 进阶应用3.1 统计应用3.2 hyperloglog3.3 GEO3.4 bitmap 4. 布隆过滤器5. Redis 经典问题5.1 缓存预热5.2 缓存穿透5.3 缓存击…

【每日一题】2085. 统计出现过一次的公共字符串-2024.1.12

题目: 2085. 统计出现过一次的公共字符串 给你两个字符串数组 words1 和 words2 ,请你返回在两个字符串数组中 都恰好出现一次 的字符串的数目。 示例 1: 输入:words1 ["leetcode","is","amazing&q…

内容分发功能升级!一站式搞定文案生成/违规检测/一键分发全流程

随着社交媒体的不断发展,越来越多的企业开始布局新媒体矩阵,从集团总部到区域门店、个人销售,从全品类到细分垂直类目、从单一平台到多平台,试图让品牌影响力覆盖更广泛群体, 当然,随之而来的,如…

groovy XmlParser 递归遍历 xml 文件,修改并保存

使用 groovy.util.XmlParser 解析 xml 文件,对文件进行修改(新增标签),然后保存。 是不是 XmlParser 没有提供方法遍历每个节点,难道要自己写? 什么是递归? 不用说,想必都懂得~ …

无代码DIY图像检索

软件环境准备 可参见《HuggingFists-低代码玩转LLM RAG-准备篇》中的HuggingFists安装及Milvus安装。 流程环境准备 图片准备 进入HuggingFists内置的文件系统,数据源->文件系统->sengee_fs_settings_201创建Image文件夹将事先准备的多张相同或不同种类的图…

理论U3 决策树

文章目录 一、决策树算法1、基本思想2、构成1)节点3)有向边/分支 3、分类步骤1)第1步-决策树生成/学习、训练2)第2步-分类/测试 4、算法关键 二、信息论基础1、概念2、信息量3、信息熵: 二、ID3 (Iterative Dichotomis…

QT 文本框的绘制与复选框组键

.cpp文件 #include "widget.h" #include "ui_widget.h"#include<QDebug> Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget) {ui->setupUi(this);//更改窗口标题setWindowTitle("我爱xyy");//更改图标setWindow…

【高级应用】Flink Cep模式匹配

什么是Cep&#xff1f; 在流式数据中&#xff08;事件流&#xff09;&#xff0c;筛选出符合条件的一系列动作&#xff08;事件&#xff09;【复杂事件处理】 什么是 Flink-Cep&#xff1f; Flink Cep库Api 【实时操作】 官方文档 什么是Pattern&#xff1f; Pattern就是…

书客、柏曼、松下护眼台灯哪款更靠谱?实测核心数据对比PK!

随着科技时代的到来&#xff0c;人们的生活水平在不断提高&#xff0c;不少家长开始担心自家孩子的近视问题&#xff0c;护眼台灯在家庭中的讨论热度也越来越高&#xff0c;光线舒适又具备多种功能&#xff0c;不少家长都给孩子入手了护眼台灯。不过作为家电博主&#xff0c;我…

一天一个设计模式---适配器模式

概念 适配器模式是一种结构型设计模式&#xff0c;用于将一个类的接口转换成客户端所期望的另一个接口。它允许不兼容的接口之间进行协同工作&#xff0c;使得原本由于接口不匹配而无法合作的类能够一起工作。 具体内容 适配器模式主要包括以下几个要素&#xff1a; 目标接…

Open CV 图像处理基础:(一)Open CV 在windows环境初始化和 Java 动态库加载方式介绍

Open CV 在windows环境初始化和 Java 动态库加载方式介绍 目录 Open CV 在windows环境初始化和 Java 动态库加载方式介绍OpenCV安装opencv-4.4.0下载安装 加载opencv-4.4.0.jar包jar包引入mavn-init.cmdjar包装载到本地maven仓库pom.xml加载动态库 加载动态库opencv_java440.dl…