修改 this 指向

文章目录

  • 前言
  • 一、new关键字改变this指向
  • 二、 call()
  • 三、apply()
  • 四 、bind()
  • 五、总结


前言

修改 this 指向,四种方法

一、new关键字改变this指向

//构造函数版this
function Fn(){this.user = "追梦子";
}
var a = new Fn();
console.log(a.user); //追梦子

二、 call()

var a = {user:"追梦子",fn:function(){console.log(this.user); //追梦子}
}
var b = a.fn;
b.call(a);  //若不用call,则b()执行后this指的是Window对象

call方法除了第一个参数以外还可以添加多个参数

var a = {user:"追梦子",fn:function(e,ee){console.log(this.user); //追梦子console.log(e+ee); //3}
}
var b = a.fn;
b.call(a,1,2);

三、apply()

var a = {user:"追梦子",fn:function(){console.log(this.user); //追梦子}
}
var b = a.fn;
b.apply(a);

apply方法和call方法有些相似,它也可以改变this的指向,也可以有多个参数,但是不同的是,第二个参数必须是一个数组

var a = {user:"追梦子",fn:function(e,ee){console.log(this.user); //追梦子console.log(e+ee); //11}
}
var b = a.fn;
b.apply(a,[10,1]);

//注意如果call和apply的第一个参数写的是null,那么this指向的是window对象

var a = {user:"追梦子",fn:function(){console.log(this); //Window {external: Object, chrome: Object, document: document, a: Object, speechSynthesis: SpeechSynthesis…}}
}
var b = a.fn;
b.apply(null);

四 、bind()

var a = {user:"追梦子",fn:function(){console.log(this.user);}
}
var b = a.fn;
b.bind(a);  //代码没有被打印

我们发现代码没有被打印,对,这就是bind和call、apply方法的不同,实际上bind方法返回的是一个修改过后的函数

var a = {user:"追梦子",fn:function(){console.log(this.user); //追梦子}
}
var b = a.fn;
var c = b.bind(a);
c();

五、总结

区别:
call和apply都是改变上下文中的this并立即执行这个函数
bind方法可以让对应的函数想什么时候调就什么时候调用,并且可以将参数在执行的时候添加,这是它们的区别

call()、bind()、apply()的用法,改变this的指向,区别在于
f.call(obj, arg1, arg2…),
f.bind(obj, arg1, arg2,…)(),
f.apply(obj, [arg1, arg2, .])

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

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

相关文章

默认方法和多重继承

最近卢卡斯JOOQ埃德尔发布和文章有关嵌套类及其使用。 这是一个有趣的话题&#xff0c;他的文章一如既往地有趣并且值得一读。 我只同意一个简短的声明&#xff0c;我们有一个简短的回复链&#xff0c;导致默认方法&#xff0c;以及为什么不能有类似的东西 class Outer {<n…

uniapp uni.request GET方式请求,不能直接传数组解决方法

这里写目录标题目录遇到的问题 GET请求方法传数组解决方案目录 遇到的问题 GET请求方法传数组 想传一个数组&#xff0c;但是后台接受到的数据与浏览器中显示的数据和前台代码传的不一样&#xff1b; 前台代码打印 浏览器显示数据 其中HerbalNameList &#xff0c;变成了字…

休眠CascadeType.LOCK陷阱

介绍 引入了Hibernate 显式锁定支持以及Cascade Types之后 &#xff0c;就该分析CascadeType.LOCK行为了。 休眠锁定请求触发内部LockEvent 。 关联的DefaultLockEventListener可以将锁定请求级联到锁定实体子级。 由于CascadeType.ALL也包括CascadeType.LOCK &#xff0c;因…

c++中在堆和栈中申请空间的差别

堆中和栈中申请的空间的比较, 我找到了下面的比较: 栈的情况&#xff1a;栈上分配空间的好处是快&#xff0c;而且对象生存期是自动的&#xff0c;离开当前域之后就自动析构回收。坏处就是栈空间有限&#xff0c;而且不能人为控制对象的生存期&#xff0c;比如你无法将一个函数…

推销自己的海盗猫王运营商

因此&#xff0c;Java没有Elvis运算符&#xff08;或者更正式的名称是null合并运算符或null安全成员选择&#xff09;……虽然我个人不太在意它&#xff0c;但有些人似乎很喜欢它。 当一位同事需要几天后&#xff0c;我坐下来探讨了我们的选择。 而且你知道什么&#xff01; 您…

sunos 查cpu主频指令prtdiag

sun查cpu主频指令 usr/sbin/psrinfo -v ...虚拟处理器 63 在下列时间的状态&#xff1a;09/10/2013 14:23:52自 04/08/2013 17:41:40 开始已在运行。sparcv9 处理器以 2660 MHz 运行,而且有 sparcv9 浮点数处理器 sun的prtdiag指令: 查cpu个数 bash-3.2$ uname -a SunOS m5000…

使用CDI简化JAX-RS缓存

这篇文章&#xff08;通过一个简单的示例&#xff09;说明了如何使用CDI Producers使其在RESTful服务中利用缓存控制语义更加容易 与HTTP 1.0中可用的Expires标头相比&#xff0c; HTTP 1.1中添加了Cache-Control标头&#xff0c;这是急需的改进。 RESTful Web服务可以利用此标…

字符串字符和数字分割

现在有个String类型的字符串&#xff1a; String str"AA120"; 我想把它分解成 AA &#xff1b;120 就是把数字和字母分开&#xff1b; 求方法 补充&#xff1a; 格式是前面是字母 不确定几位&#xff0c;后面是数字&#xff0c;也不确定几位 就是"AA111…

transform限制position:fixed的跟随效果

我们应该都知道&#xff0c;position:fixed可以让元素不跟随浏览器的滚动条滚动&#xff0c;而且这种跟随效果连它的兄弟们position:relative/absolute都限制不了。但是&#xff0c;真是一物降一物&#xff0c;position:fixed固定效果却被小小的transform给干掉了&#xff0c;直…

Maven提示:有关可执行jar的所有信息

Maven提示&#xff1a;有关可执行jar的所有信息 在分发代码时&#xff0c;可执行jar是非常有用的工具。 这意味着&#xff0c;只要将Java安装在客户端计算机上&#xff0c;至少在Windows和Mac上&#xff0c;您的用户只需双击jar即可启动程序。 另外&#xff0c;在命令行上&…

C# 查询一张表的数据用于补充另外一张表的数据 MySQL数据库

UPDATE bookhistory bh set bh.CategoryId (SELECT CategoryId FROM booklist bk where bk.Id bh.BookListId)

Gentoo man手册指南

转载&#xff1a;http://www.gentoo.org/doc/zh_cn/man-guide.xml#doc_chap2 http://blog.csdn.net/andyelvis/article/details/4044938 使用man命令技巧 Gentoo man手册指南 内容: 1. 简介2. 使用man结构 1. 简介 man程序 每一个人在他的linux人生中都使用…

Java 8 Lambda表达式教程

问候&#xff01; :) 离开几个月后&#xff0c;我决定恢复风格:)。 我注意到我以前有关新的Date / Time API的一篇文章非常受欢迎&#xff0c;因此这次我将把本篇文章专门介绍Java 8的另一个新功能&#xff1a; Lambda Expressions 。 功能编程 Lambda表达式是Java编程语言最…

React 父组件(hooks)调用子组件(calss)方法

父组件&#xff08;hooks&#xff09; let richTextRef {};<RichText getRichText{getRichText} content{content} onRef{ref > richTextRef ref} />子组件&#xff08;class&#xff09; componentDidMount () > {this.props.onRef && this.props.onRe…

[HDU] 2553 N皇后问题-简单深搜

题目链接&#xff1a; http://acm.hdu.edu.cn/showproblem.php?pid2553 方法&#xff1a; 1.可以用对称的思想&#xff0c;即&#xff1a;如果N是偶数&#xff0c;则只计算第一个皇后分别放在第一行的位置1到N/2这N/2个情况的结果和&#xff0c;最后再乘以2。如果是奇数&#…

您真的了解@WebService吗?

SOAP Web服务无论如何都不是最先进的技术-尽管它仍然存在&#xff0c;但是基于REST的Web服务却提供了激烈的竞争。 无论如何–这绝对不是REST vs SOAP帖子&#xff01; 我观察到了一些实例&#xff0c;至少可以说&#xff0c;使用基于Java的SOAP Web服务的方式不太理想。 我认…

全局使用dva dispatch

// 第一种 这个umi2还可以 umi3就不可以了 window.g_app._store.dispatch({type: login/logout,});// 第二种 调用dispatch(所有models都可以) getDvaApp()._store.dispatch({type: login/logout,});

[转]JQuery.Ajax之错误调试帮助信息

本文转自&#xff1a;http://blog.csdn.net/lampsunny/article/details/8053967 下面是Jquery中AJAX参数详细列表&#xff1a; 参数名 类型 描述 url String (默认: 当前页地址) 发送请求的地址。 type String (默认: "GET") 请求方式 ("POST&quo…

将策略插入JBoss Apiman

JBoss apiman项目 本周刚刚发布了1.0.3.Final 。 它主要是一个错误修复版本&#xff0c;仅进行了一些相对较小的改进。 自从我上次写博客以来&#xff0c;其中的一个特殊功能就是对插件的支持。 这些插件可以轻松添加到系统中&#xff0c;以提供其他功能。 将策略添加为插件 当…