改变this 指向的3种方法
1.在函数内部声明一个that，然后将this赋值给that,
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body> </body>
<script>
const team={
members:["Herry","hrll"],
teamName:"Es6",
teamSummary:function() {
var that=this;
return this.members.map(function(member) {
return `${member}隶属于${that.teamName}`
})
}
}
console.log(team.teamSummary())
</script>
</html>
2.用bind方法，绑定外部的this
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body> </body>
<script>
const team={
members:["Herry","hrll"],
teamName:"Es6",
teamSummary:function() { return this.members.map(function(member) {
return `${member}隶属于${this.teamName}`
}.bind(this))
}
}
console.log(team.teamSummary())
</script>
</html>
3.直接使用箭头函数
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body> </body>
<script>
const team={
members:["Herry","hrll"],
teamName:"Es6",
teamSummary:function() { return this.members.map((member)=> {
return `${member}隶属于${this.teamName}`
})
}
}
console.log(team.teamSummary())
</script>
</html>
3个显示效果：
改变this 指向的3种方法的更多相关文章
- 【面试题】JS改变this指向的三种方法
一.this指向 点击打开视频讲解更加详细 this随处可见,一般谁调用,this就指向谁.this在不同环境下,不同作用下,表现的也不同. 以下几种情况,this都是指向window 1.全局作用下 ...
- ES5中改变this指向的三种方法
ES5中提供了三种改变函数中this指针指向的方法,分别如下 1.call() var obj = {username:"孙悟空"}; //没有任何修饰的调用函数,函数中的this ...
- 改变this指向的三种方法
call.apply.bind三者为改变this指向的方法. 共同点:第一个参数都为改变this的指针.若第一参数为null/undefined,this默认指向window call(无数个参数) ...
- js 改变this指向的三种方法 bind call apply
先了解下bind call apply 的注意点 bind 需要手动调用 第一个参数 this 要指向的对象,后面是 散列的参数 call 不需要手动调用 第一个参数 this 要指向的对象,后面是 ...
- Linux 中改变主机名的 4 种方法
今天,我们将向你展示使用不同的方法来修改主机名.你可以从中选取最适合你的方法. 使用 systemd 的系统自带一个名为 hostnamectl 的好用工具,它可以使我们能够轻易地管理系统的主机名. ...
- html之改变图片透明度而不改变文字的透明度--两种方法实现
图片与图片上的文字设置不同的透明度的两种方法: 第一种方法:背景图+定位+background: url(timg.jpg)no-repeat; <!DOCTYPE html> <h ...
- unity 改变鼠标样式的两种方法
1.第一个直接改变鼠标样式 public var cursorTexture:Texture2D; private var changeFlag = false; function Update(){ ...
- Android 改变字体颜色的三种方法
在TextView中添加文本时有时需要改变一些文本字体的颜色,今天学到了三种方法,拿出来分享一下 1.在layout文件下的配置xml文件中直接设置字体颜色,通过添加android:textc ...
- 改变javascript函数内部this指针指向的三种方法
在查了大量的资料后,我总结了下面的三条规则,这三条规则,已经可以解决目前我所遇到的所有问题.规则0:函数本身是一个特殊类型,大多数时候,可以认为是一个变量. function a() { alert( ...
随机推荐
- apache的commons-fileupload中FileItem类和ServletFileUpload
FileItem类的常用方法 1.boolean isFormField().isFormField方法用来判断FileItem对象里面封装的数据是一个普通文本表单字段,还是一个文件表单字 ...
- python之命名元组的好处
collections.namedtuple() 命名元组的一个主要用途是将你的代码从下标操作中解脱出来举例使用 # 使用 from collections import namedtuple Sub ...
- 通信有连接有消息队列选择boost.asio
通信有连接有消息队列选择boost.asio 连接自主管理 消息队列自主管理
- 简单API接口签名验证
前言 后端在写对外的API接口时,一般会对参数进行签名来保证接口的安全性,在设计签名算法的时候,主要考虑的是这几个问题: 1. 请求的来源是否合法 2. 请求参数是否被篡改 3. 请求的唯一性 我们的 ...
- 自定义solr域中的配置
<!-- IKAnalyzer--> <fieldType name="text_ik" class="solr.TextField"> ...
- SQL LIKE 运算符
SQL LIKE 运算符 在WHERE子句中使用LIKE运算符来搜索列中的指定模式. SQL LIKE 操作符 LIKE 操作符用于在 WHERE 子句中搜索列中的指定模式. 有两个通配符与LIKE运 ...
- 【操作】Linux快捷键
- rails问题检查
在做rails postgresql过程中,使用同事的老代码,然后坐到db:migrate时发现总是报错 这种错误是无法在百度或者google搞定的,需要去进入到底层查看 所以需要进入相关文件看,到d ...
- 「题解」：$Smooth$
问题 A: Smooth 时间限制: 1 Sec 内存限制: 512 MB 题面 题面谢绝公开. 题解 维护一个队列,开15个指针,对应前15个素数. 对于每一次添加数字,暴扫15个指针,将指针对应 ...
- docker 网络和/etc/docker/daemon.json文件详情
/etc/docker/daemon.json(没有就创建) [root@master ~]# /etc/docker/deamon.json { "registry-mirrors&quo ...