箭头函数this
箭头函数的this值是由包含它的函数(非箭头函数)来决定的,与包含的函数的this指向一致,如果包裹它的不是函数(直到找到最外层)则this指向全局对象
并且箭头函数的this是固定的,由定义它时所在的环境(以上)所决定,而不是如非箭头函数那样由如何调用该函数来决定
var name = 'atm'
var person = {
name: 'mxk',
getName: () => console.log(this.name)
}
person.getName() // atm
// 从这里可以看出箭头函数的this并不向非箭头函数的this那样指向person对象
var person = {
name: 'mixukai',
getName: function() {
(() => console.log(this.name))()
}
}
person.getName() // 'mixukai'
// 上面这个例子可以看到箭头函数的this成功指向了getName这个函数的this对象
function Fn(a, b ,c) {
this.a = 'outer',
this.b = {
a: 'inner',
c: function() { console.log(this.a) }
}
}
new Fn().b.c() // inner
function Fn(a, b ,c) {
this.a = 'outer',
this.b = {
a: 'inner',
c: () => console.log(this.a)
}
}
new Fn().b.c() // outer
因为它的this值是不能改变的,因此箭头函数也不能利用call(),apply(),bind()这三个方法来改变this,尽管如此它还是可以使用这三个方法,因为它依旧是函数,是Function构造函数的实例
箭头函数this的更多相关文章
- ES6 箭头函数中的 this?你可能想多了(翻译)
箭头函数=>无疑是ES6中最受关注的一个新特性了,通过它可以简写 function 函数表达式,你也可以在各种提及箭头函数的地方看到这样的观点——“=> 就是一个新的 function”. ...
- ES6箭头函数与展开运算符
箭头函数:省去了关键字function和return: eg: reduce=(a,b)=>a+b;//返回a+b的值 redduce=(a,b)=>{console.log(a);con ...
- 箭头函数和Buffer对象
一.箭头函数 普通函数1 var add = function (a, b) { return a + b; } 普通函数2 function add (a, b) { return a + b; } ...
- 深入理解this机制系列第三篇——箭头函数
× 目录 [1]痛点 [2]解决 [3]基本用法[4]回调函数[5]注意事项 前面的话 this机制与函数调用有关,而作用域则与函数定义有关.有没有什么是可以将this机制和作用域联系起来的呢?本文将 ...
- Es6 箭头函数
1.单参数function cheng(a=3){ return a*a;}let cheng= (a=3)=>a*a;console.log(cheng(9));2.多参数functio ...
- 【javascript】箭头函数
ES6标准新增了一种新的函数:Arraw Function(箭头函数). x => x * x 这个函数相当于 function (x){ return x * x; } 题外话:user st ...
- JS中generater和箭头函数
generater跟函数很像: function* fn(x){ yield x; yield x++; return x;} 如上所示,generater用function*定义,可以用yield返 ...
- 箭头函数 Arrow Functions/////////////////////zzz
箭头符号在JavaScript诞生时就已经存在,当初第一个JavaScript教程曾建议在HTML注释内包裹行内脚本,这样可以避免不支持JS的浏览器误将JS代码显示为文本.你会写这样的代码: < ...
- ES6里箭头函数的陷阱
ECMAScript 6新增了箭头函数 原来的匿名函数 function(){},现在可以简化成()=>{} 看起来高大上,像C#什么的语法. 但是箭头函数的this对象,不能更改,总是指向函数 ...
- JavaScript箭头函数 和 generator
箭头函数: 用箭头定义函数........ var fun = x=>x*x alert(fun(2)) //单参数 var fun1 = ()=& ...
随机推荐
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 辅助类:显示关闭按钮
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- Iterator作用
前言 下面的内容是我从百度知道拷贝出来的,也就不在贴出链接了.我总结下就是迭代器在集合中使用,用户不需要关心具体集合实现的是如何遍历(不暴露细节),按照迭代器的方式遍历. 作用 Iterator模式是 ...
- 新闻网大数据实时分析可视化系统项目——3、Hadoop2.X分布式集群部署
(一)hadoop2.x版本下载及安装 Hadoop 版本选择目前主要基于三个厂商(国外)如下所示: 1.基于Apache厂商的最原始的hadoop版本, 所有发行版均基于这个版本进行改进. 2.基于 ...
- 大数据篇:DolphinScheduler-1.2.0.release安装部署
大数据篇:DolphinScheduler-1.2.0.release安装部署 1 配置jdk #查看命令 rpm -qa | grep java #删除命令 rpm -e --nodeps xxx ...
- php 实现店铺装修2
<?php namespace Webapp\Model; use Common\Model\DataModel\FlagShopCategoryModel; use Common\Model\ ...
- 105、Java中String类之利用indexOf()方法判断子字符串是否存在
01.代码如下: package TIANPAN; /** * 此处为文档注释 * * @author 田攀 微信382477247 */ public class TestDemo { public ...
- C++ Primer Plus 6 笔记(2)
第4章 1.求数组元素个数的一种方法:num=sizeof 数组名/sizeof (元素类型) 2.确定字符串所需的最短数组时,别忘了将结尾的'\0'计算在内.表面可以无,内存必须有. 3.'S'表示 ...
- Cadence套件:Capture + Allegro应用笔记
1.在Allegro中导入Netlist时,需要进行封装路径的设定: 在Setup->User Preference的Path->Library下面,设定所需封装文件(psm).焊盘文件( ...
- 【转】深入分析JAVA IO(BIO、NIO、AIO)
IO的基本常识 1.同步 用户进程触发IO操作并等待或者轮询的去查看IO操作是否完成 2.异步 用户触发IO操作以后,可以干别的事,IO操作完成以后再通知当前线程继续处理 3.阻塞 当一个线程调用 r ...
- SQL注入的原理及分析
注入攻击的本质:将用户输入的数据当做代码执行. 有2个限制条件: 1.用户能够控制输入. 2.原本程序要执行的代码,拼接了用户输入的数据后进行执行. 定义:用户输入的数据被当做SQL语句执行. 以下面 ...