ES6中this 指向的问题探索

问题背景：由于最近在看项目源码，本身个人非前端开发。看到代码中的this就会有些困惑this的指代是什么。
参考链接：深入理解ES6箭头函数中的this
                  ES6箭头函数的this指向
                  JavaScript 的 this 原理
实验过程：

this的指代分为两种情况。普通的函数和箭头函数。

1. 普通函数

可以见得普通函数的时候，this指代的是window对象。因为当执行test()的时候，可以考虑为是window.test()。当前的对象是window

var value="outer"
var obj ={
	value:"inner",
	getValue:function(){
		console.log(this.value);
	}
}
方式一：
obj.getValue()
输出：
inner

方式二：
var getValue=obj.getValue
getValue()
输出：
outer

可以看到普通函数方式下this指代的是调用该方法的对象。方式一中运行环境是obj环境。obj对象调用的getValue()方法。所以返回的是“inner”。方式二，getValue()运行的环境是全局。所以输出outer。可以理解为运行的时候去决定this的指代。

2. 箭头函数

var value ="outer";
var obj ={
	value:"inner",
	getValue:()=>{
		console.log(this.value);
	}
}

obj.getValue()
输出：
outer

 

this 在箭头函数中所指代的并不是运行时的对象，而是在定义的时候所在的对象决定。也就是根据外层的作用域（函数或者全局）来确定。譬如上面的例子中箭头函数生效是在obj对象生成的时候。箭头函数总是指向定义生效所在的对象所以

 

以下我们再来看几种情况。

外部定义的全局变量name为outer，普通方法test中将全局name修改为了inner。所以以上this指代的还是window。

对于普通函数，生命对象t所处的环境是全局，所以返回值是outer