从函数调用方式了解this指向

this是js面向对象编程的一个重要组成部分。当我们问多数人this指向问题时，大多数都能说出，指向它的调用者。事实上，this参数的指向不仅是由定义函数的方式和位置决定的，同时还会受到函数调用方式的影响。因此，首先我们来了解函数不同的调用方式。

了解函数调用的四种方式

• 作为一个函数调用
• 作为一个方法，关联在一个对象上调用
• 作为一个构造函数，实例化一个新的对象
• 通过函数的apply或call方法

1. 通过函数的方式调用

function test() {
	return this;    
}
var test = test()  
console.log(test)  // 此时该函数直接调用，this指向window；

当一个函数没有作为对象的属性、构造函数以及apll、call方法去调用，那么此时该函数就是作为函数直接调用。当以这种方式调用函数时，在严格模式下，函数上下文为undefined；在非严格模式下，函数上下文为window对象；

2. 作为方法被调用

var test = {};
test.fn = function(){}
test.fn()

此时该函数被作为对象的方法调用，fn函数被赋值给一个对象的属性，并且通过对象属性引用的方式调用函数。当函数作为对象的方法被调用时，该对象会成为函数的上下文，并且函数内部可以通过参数访问到。

function context() {
	return this;
}

context()

var getMyContext = context;
getMyContext()

var test = {
	getMyContext: context;
}
test.getMyContext() 

这段代码中，有一个名为context的函数，调用它会返回该函数的上下文。首先当我们作为函数直接调用，此时它的上下文是window（因在非严格模式下）；当通过变量getMyContext创建了context的一个引用，使用变量getMyContext来调用函数，该函数仍然作为函数被调用，上下文依然是window对象；当我们创建一个对象test，其属性getMyContext得到了context的引用，当调用test对象的getMyContext属性时，getMyContext函数作为对象的方法被调用，此时函数的上下文指向该方法所在的对象（test）；

3. 作为构造函数调用

function GetMyContext() {
	this.getThis = function () {
		return this;
	}
}

var test = new GetMyContext() 

在此例中，我们创建了一个名为GetMyContext的函数，通过new关键字调用；当通过new关键字调用时会触发以下几个动作：

• 创建一个空对象；
• 该对象作为this参数传递给构造函数，从而成为该构造函数的上下文；
• 新构造的对戏那个作为new运算符的返回值
  再来看一下GetMyContext通过new关键字发生了什么：

function GetMyContext() {
	this.getThis = function () {  // 3.为该函数增加一个新的方法，也就是getThis方法 4.新构造的对象作为函数的返回值；
		return this;
	}
}

var test = new GetMyContext()   // 1.使用new关键字调用函数，创建了一个新的空对象；
// 2. 新的空对象test被设置为该函数的上下文；

现在，我们可以了解构造函数的目的是创建一个新对象，并进行初始化设置，然后将其作为构造函数的返回值；

那么构造函数的目的是初始化新创建的对象，并且新构造的对象会作为构造函数的调用结果返回，但是如果构造函数自身设有返回值时会怎样？返回新创建的对象？还是返回自身设有的返回值？

function GetMyContext() {
	this.getThis = function () {
		return this;
	}
	return true
}

var test = new GetMyContext() 

var rules = {
	returnResult: true;
}
function GetResult() {
	this.returnResult = false
	return rules
}

var test = new GetResult() 
console.log(test.returnResult)

答案是：如果构造函数返回一个对象，则该对象将作为整个表达式的值返回，而传入构造函数的this将被丢弃；但是，如果构造函数返回的是非对象类型，则会忽略返回值，返回新创建对象；

4. 使用apply和call调用
   apply、call的作用是改变this指向，唯一不同之处在于参数不同：apply传递一个参数数组，call传递一个参数列表。使用它们之后，会强制指定回调函数的函数上下文。

解决函数上下文问题

当函数上下文与预期不符时，可以使用apply、call方法；除此之外，我们介绍一下箭头函数以及bind方法；

1. 使用箭头绕过函数上下文；
   箭头函数没有单独的this值。箭头函数的this与声明所在的上下文相同。

function Test(){
	this.getThis = () => {
		this.result = true
	}
}

调用箭头函数时，不会隐式的传入this，而是从定义时的函数继承上下文。
2. 使用bind方法